在實際顯示它們之前加載AJAX內容

動畫結束後，我加載了一個AJAX請求。不過，我想加載ajax，hide（），我已經加載它，然後在動畫完成後簡單地顯示（）它。我的想法是，我不必擔心用戶等待加載圖像，並且我可以在所有等待動畫完成的地方複製該圖像。即使只是文字。在實際顯示它們之前加載AJAX內容

我可以簡單地把它放在一些格式爲display：none;並隱藏它，但它困擾我，它仍然在技術上「在那裏」在頁面上。有什麼方法可以將內容加載到用戶根本看不到的地方？

已解決。確實，我不希望它在DOM中，並希望有一些CSS3/HTML5可以「保留」元素。：P我也知道其他人有很好的方法來做到這一點，所以我需要最好的。我想我明白了。感謝大家。

來源

2011-10-03 Vael Victus

你可以給它-9999px頂部的陰性切緣，然後將它放在合適的位置需要 –

的時候，我相信Vael沒有按根本不需要它在DOM中。這就是我從他的問題中得出的結論。 –

沒有辦法預加載它，但沒有它「有」。 – BNL

創建CSS類，如下所示：

.hiddenelement 
{ 
    position:absolute !important; 
    left:0% !important; 
    top:0% !important; 
    width:0% !important; 
    height:0% !important; 
}

使用.addClass('hiddenelement')當你隱藏的元素，.removeClass('hiddenelement')當你顯示它。

當然，如果您的嵌入式樣式標記爲!important，則這不起作用。

注：我相信這可能沒有定位的工作。

來源

2011-10-03 15:25:05 yoozer8

您可以從屏幕上加載內容（如position: absolute; left: -500px;），但這與將其加載到您想要的位置並將其設置爲display: none並無區別。另外，你必須在顯示它之前移動它。

我認爲你的第二段中的第一個建議是你應該做的：將它加載到樣式爲display: none的div中，然後只需重置display屬性或在動畫完成時淡入元素。

來源

2011-10-03 15:24:17

你擁有它完全正確。您必須將內容加載到頁面上的容器中，以便瀏覽器知道它需要開始處理它。沒有什麼「錯誤」與做這樣的，所以不要讓它打擾你:)

var container = $('#myContainer'); 
container.hide(); 
container.html(ajaxResult); 
container.fadeIn();

應該這樣做......

我相信你甚至可以做到這一點：

$('#myContainer').hide().html(ajaxResult).fadeIn();

來源

2011-10-03 15:24:21

聽起來像你試圖解決一個不需要解決的問題。用戶不會在乎它是否在某處，因爲無論如何你都會展示它，所以你不需要「隱藏」它。也就是說，如果您使用.ajax()而不是，則您將完全控制返回的數據;你不需要將它添加到DOM，直到你想。一旦它在DOM中，您可以使用.detach()刪除它，而不會在以後再次需要時將其刪除。

來源

2011-10-03 15:25:02

我實際上使用.ajax（）。謝謝您的幫助。：} –

不知道我的理解正確，但你可以這樣做：

start_animation(); 
$.get('url', function(response) { stop_animation_and_show_content(response); }); 

function stop_animation_and_show_content(html) { 
    // ... 
}

來源

2011-10-03 15:35:35 deviousdodo

在實際顯示它們之前加載AJAX內容

回答

相關問題