在Chrome瀏覽器中，頁面將不會在Ajax加載後調整大小

我一直在狂熱地使用CSS來瀏覽我正在構建的網站的最後一段，而我只是遇到了一個奇怪的怪癖。 FF和IE似乎工作正常。在Chrome瀏覽器中，頁面將不會在Ajax加載後調整大小

我正在使用jQuery加載HTML存根，在這種情況下，很多來自外部博客的內容，但是當從真正的長頁面切換到真正的短頁面時，我獲得了大約一英里未使用的頁面仍然粘貼到文檔的結尾。

這裏是哪裏存根被裝入貌似頁面的正文：

<body> 
    <div id="page"> 
    <div id="mainWrapper"> 
     <div id="headerFullWidth"></div> 
     <div id="fixedwidthcontainer"> 
     <div id="header"> 
      <div id="logo"><img src="images/logo.png" height="85px" width="187px"></div> 
      <div id="shoppingcart"></div> 
      </div> 
      <div id="shoppingCartIcon"></div> 
     </div> 
     <div class="contentSpacer"></div> 
     <div id="contentwrapper"> 
      <div id="content"></div> 
     </div> 
     <div class="contentSpacer"></div> 
     <div id="footer"> 
      <div id="footerContent"> 
      <a href="#contactPopupContent" id="contactfooter">Contact Us</a><a href="#privacyPopupContent" id="privacyfooter">Privacy Policy</a><a href="#shippingPopupContent" id="shippingfooter">Shipping & Returns</a> 
      <div id="copyrightfooter">&copy; 2011 Victory Barbers and Brand</div> 
      </div> 
     </div> 
     <div id="fullWidthFooter"></div> 
     </div> 
    </div> 
    </div> 
</body>

我所有的負載都使用jQuery load()做，我不得不說沒有網站的迭代有這個問題。我一直在嘗試更寬的樣式，並且在這個過程中出現了這個問題。

我的問題是這樣的：有沒有辦法強制頁面重新檢查其大小時，移動到不同/較短的內容？

來源

2011-06-08 ian hoar

「調整整個窗口的大小」如果需要，我可以發佈鏈接到網站。 ' - 做吧 – thirtydot 2011-06-08 09:11:54

這麼多的id和class選擇。你真的需要他們嗎？ – orustammanapov 2012-12-11 18:42:59

我遇到的問題與我遇到的完全相同，我回答的答案是否定的。

我只是設法解決這個問題，通過AJAX加載後檢查新內容與新內容的高度，並使用jQuery設置正確的高度。

如果有人能夠找到一種方法來強制自動調整大小，但同時此解決方案完美工作，無論內容的數量如何，這都會非常好。

來源

2011-06-24 23:31:19

我檢查了Chrome開發人員工具，並且我加載的div具有正確的大小。如果您將鼠標懸停在div或body或html上，它們會停留在內容的底部，並在其下方顯示大量空白空間。在div，body或window上調用jQuery的「.resize（）」並沒有幫助。 – 2013-05-03 14:30:21

我能夠用css實際解決它。問題在於我絕對放置了我的頁面包裝器元素，因此它實際上位於body元素之外。我刪除了位置：絕對;頂部：0;左：0;只需放一個邊框：0;和填充：0;在身體元素上。

來源

2011-06-25 20:39:33

它應該是一個純粹的CSS問題，我沒有用AJAX自己的AJAX，但當內容被稱爲你使用這個？

document.getElementById('myDiv').innerHTML=myResult

或者你使用jQuery

$('#myDiv').html(myResult); 

$('#myDiv').append(myResult);

，如果你使用jQuery，你應該清理DIV第一，像這樣：

$('#myDiv').html(''); 
$('#myDiv').html(myResult);

如果不幫助你可以使用固定高度並使用溢出CSS屬性

 #myDiv { 
     height:600px 
     overflow:auto; 
    }

當然，固定的高度並不總是最好的解決方案，但它可能會對您有所幫助。

來源

2011-07-06 15:43:21 victorhqc

如果推動推動，您可以隨時加載一些JavaScript後強制高度。

我儘量遠離position:absolute。

來源

2011-11-08 16:29:57 Zeleres

您可以使用CSS來解決：

#myDiv{max-height:value; overflow:auto;}

來源

2012-04-04 13:18:47 Sam

-2

asyncBoolean

默認：true

默認情況下，所有的請求都是異步發送（即這是默認設置爲true）。如果您需要同步請求，請將此選項設置爲false。跨域請求和dataType：「jsonp」請求不支持同步操作。請注意，同步請求可能會暫時鎖定瀏覽器，禁用任何行動，同時請求被激活。」

http://api.jquery.com/jQuery.ajax/

來源

2012-04-11 14:35:44 user1322163

從jQuery 1.8開始，同步AJAX調用被棄用，不要使用它們，它們將來會被刪除。這就是說我不明白爲什麼使用同步呼叫會幫助解決這個問題。 – 2013-02-23 21:30:56

我認爲我已經找到了解決這個。（至少我在.ajax回調中，用$('div').html(data);設置內容後，我用$(window).resize();

來源

2013-05-03 14:41:39

在Chrome瀏覽器中，頁面將不會在Ajax加載後調整大小

回答

相關問題