JQuery Ajax：舊內容在顯示加載的內容之前彈出

對我的ajax代碼有問題。我有一些鏈接和內容區域。當我點擊鏈接時，我隱藏了內容區域，加載新數據並再次顯示內容區域。它可以工作，但是當顯示內容區域時，您會在短時間內看到舊內容，然後閃爍到新內容。JQuery Ajax：舊內容在顯示加載的內容之前彈出

我能以某種方式讓加載屏幕顯示更長時間嗎？此外，隱藏功能只在我第一次使用鏈接時起作用。

jQuery(document).ready(function() {

 jQuery('.ajax').click(function(){ 

var toLoad = jQuery(this).attr('href'); 
jQuery('#ajax_content').hide('slow',loadContent); 
jQuery('#load').remove(); 
jQuery('#main').append('<span id="load">LOADING...</span>'); 
jQuery('#load').fadeIn('normal'); 

function loadContent() { 
    jQuery('#ajax_content').load(toLoad,'',showNewContent()) 
} 
function showNewContent() { 
    jQuery('#ajax_content').show('normal',hideLoader()); 
} 
function hideLoader() { 
    jQuery('#load').fadeOut('normal'); 
} 
return false; 

});

});

我從this source

感謝這個Ajax代碼提前！

來源

2010-06-04 madmax

你可以嘗試發出AJAX檢索命令之前清空您的內容元素：

jQuery(document).ready(function() { 

jQuery('.ajax').click(function(){ 

var toLoad = jQuery(this).attr('href'); 
jQuery('#ajax_content').hide('slow',loadContent); 
jQuery('#load').remove(); 
jQuery('#main').append('<span id="load">LOADING...</span>'); 
jQuery('#load').fadeIn('normal'); 

function loadContent() { 
    jQuery('#ajax_content').empty().load(toLoad,'',showNewContent()) 
} 
function showNewContent() { 
    jQuery('#ajax_content').show('normal',hideLoader()); 
} 
function hideLoader() { 
    jQuery('#load').fadeOut('normal'); 
} 
return false; 

}); 

});

，使應用程序更健壯，你也可以用.queue()方法建立的動作隊列。然後，當用戶點擊另一個鏈接，而其中一個已經加載時，很容易取消。

來源

2010-06-04 15:28:07 MvanGeest

非常感謝！完美的作品。我也會看看隊列！但我仍然有一個問題。此滑出效果只能使用一次，滑出不起作用。新內容剛剛彈出... – madmax 2010-06-04 18:13:02

您可以在www.jsfiddle.net上創建一個工作示例併發布該URL嗎？這可能使我們能夠告訴你更多。 – MvanGeest 2010-06-04 18:16:10

發現它在一個簡單的html上工作。但我在Magento中使用它，並在我加載內容後，滑動功能不再工作。如果所有函數在加載後都不起作用，我會更加了解它，但它只是動畫。正在加載... 也許與Magento中的Prototype有衝突？但我使用noconflictmode jQuery ... – madmax 2010-06-04 20:52:40

JQuery Ajax：舊內容在顯示加載的內容之前彈出

回答

相關問題