如何创建ajax预加载器

我知道这是一个noob问题，但我会抛出它。如何创建ajax预加载器

$('#loading') 
.ajaxStart(function() { 
    $(this).show(); 
}).ajaxStop(function() { 
    $(this).hide(); 
})

我有我的.js这个代码，并有

<div id="loading"><img></div>

我的HTML中。

和我有一个图层，单击按钮时加载ajax。

jQuery(document.body).on('click', '.open_list', function (e) { 
e.preventDefault(); 
jQuery(".ajax_list").fadeOut(function() { 

jQuery('.list').addClass('slideIn'); 
    var $ajaxList = jQuery(this); 

    $ajaxList.load("http://lifeto.dothome.co.kr/xe/free .ajax_contents", function() { 
     $ajaxList.fadeIn(); 
    }); 
}); 
});

问题是，如何在加载数据时在.list中加载preloader div（#loading）？

我只是jQuery和ajax的初学者，所以我不知道$（this）和.ajaxStart指的是什么。

这里是我的网站的实际地址。 http://lifeto.dothome.co.kr/xe/page_FIsv96

来源

2015-02-09 Mark

刚刚看过的文档有关这两种方法：['ajaxStart']（HTTP ：//api.jquery.com/ajaxStart/）['ajaxStop']（http://api.jquery.com/ajaxStop/）。这两个链接都提供了可以在处理程序内执行的示例。你也可以调试这些处理程序，看看'this'的实际值（我认为它会是'window'对象） – 2015-02-09 08:14:05

HTML

<a href="#" id="verification" >test</a> 
<img src="example_preloader.gif" id="ajaxPreloader" style="display:none" />

$('#verification').click(function() { 
    $('#ajaxPreloader').toggle(); 
    $.ajax({ 
     type  : "POST", 
     url  : "example url", 
     data  : {'exampleData': ''}, 
     success : function(msg) { 
     $('#ajaxPreloader').text(''); 
     location.reload(); 
     }, 
     error: function(error) { 
     $('#ajaxPreloader').text(''); 
     } 
    }); 
    });

来源

2015-02-09 08:14:52 websky

我想这应该与工作

$(document) 
.ajaxStart(function() { 
    $('#loading').show(); 
}).ajaxStop(function() { 
    $('#loading').hide(); 
})

来源

2015-02-09 08:15:56

如何创建ajax预加载器

回答

相关问题