页面在Google Chrome浏览器中的$（'selector'）。html（'some content'）后跳转

当我更改页面底部的某个元素的内容时，页面会滚动到此元素的开头。例如：

$container.html($container.html());

这在FF中没有任何页面滚动效果很好。有人解决过这样的问题吗？

UDP：

我想这从第一个答案：

$ container.css（ '高度'，$ container.height（）+ '像素'）; $ container.html（$ container.html（））; $ container.css（'height'，'auto'）;

但是3行导致页面跳转，所以如果只是设置容器高度 - 它的效果很好。但我竞争的高度可以不同，它是从服务器加载的。

现在我有想法找高度插入内容后，并设置它，而不是“自动”：父容器的而Chrome回报高（innerHeight，outerHeight）：

var $c = this.options.container; 
$c.css('height', $c.height()+'px'); 
$c.html(data.content || ''); 
var $child = $c.children(); 
console.log($child.height(), $child.innerHeight(), $child.outerHeight()); 
$c.css('height', $child.height()+'px');

在FF返回高度是正确的。

来源

2011-06-08 Alerion

如果我冒险猜测这将是更快的铬重新绘制，并且容器在空的时候收缩，然后被填充其他东西。您可以尝试将高度固定为特定值，更改内容，然后再次将其设置为自动（如果这是其默认设置）。像这样（未经）：

$container.css('height',$container.height()+'px'); 
$container.html($container.html()); 
$container.css('height','auto');

来源

2011-06-08 15:15:50 Wrikken

是的，这就是为什么。我的网站和我的网站完全一样。 – callumander 2011-06-08 15:17:18

我也想过这个，试过了，但没有帮助。现在我发现设置高度确实有助于没有最后一行，但如果您设置'自动'后退页面跳转。 – Alerion 2011-06-09 07:17:05

，我发现这是典型的发生，因为我忘了上一个单击处理程序返回false，瓦特/ jQuery的，像这样：

$（ 'A'）点击（。 function（）{ $ container.html（$ container.html（））; return false; }）;

虽然，您的$ container.html（$ container.html（））;对我来说似乎很陌生。

来源

2011-06-08 15:20:19

>虽然，您的$ container.html（$ container.html（））;对我来说似乎很陌生。这是重现问题的方法。真的，我将页面内容加载到容器中。这是ajax分页。 – Alerion 2011-06-09 07:01:26

有来源解决方案。

var $c = this.options.container; 

//fix Chrome page jumping 
$.browser.webkit && $c.css('height', $c.height()+'px'); 

$c.html(data.content || ''); 

//fix Chrome page jumping 
if ($.browser.webkit) { 
    setTimeout(function(){ 
     $c.css('height', $c.children().height()+'px'); 
    }, 1); 
};

来源

2011-06-09 07:46:36 Alerion

页面在Google Chrome浏览器中的$（'selector'）。html（'some content'）后跳转

回答

相关问题