頁面在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'）後跳轉

回答

相關問題