仅对某些请求使用ajaxStart和ajaxStop jquery方法

时间:2011-01-25 06:25:30

标签: jquery ajax

我使用AjaxStart和AjaxStop jquery方法在通过Ajax发送请求时显示和隐藏加载消息。喜欢以下代码:

                $('<div><img src="images/searching.gif" align="absmiddle" border="0" />Please Wait ...</div>')
            .attr('id','loading')
            .appendTo('body')
                .ajaxStart(function() { 
                  $(this).animate({
                        top     : '40px',
                        opacity : 1.0
                   }, 500);
                })
                .ajaxStop( function(){ 
                  $(this).animate({
                       top     : '-75px',
                       opacity : 0.1
                   }, 500);
                });

但我不希望所有请求都显示此加载节目,只显示某些特定请求。 你有解决问题的方法吗?

1 个答案:

答案 0 :(得分:0)

分隔代码行以创建加载器图像并绑定ajax事件

区分需要ajaxStop / ajaxStart事件的图像和不需要ajaxStop / ajaxStart事件的图像。使用CSS类来区分图像。

为ajax事件创建加载程序映像:

for ajax:

$('<div><img src="images/searching.gif" align="absmiddle" border="0" />Please Wait ...</div>').attr('id','loading').attr('css','ajax-img').appendTo('body')

不需要ajax:

$('<div><img src="images/searching.gif" align="absmiddle" border="0" />Please Wait ...</div>').attr('id','loading').appendTo('body')

将ajaxStop和ajaxStart事件绑定到具有'ajax-img'类的图像

$('img.ajax-img').ajaxStart(function() { 
                  $(this).animate({
                        top     : '40px',
                        opacity : 1.0
                   }, 500);
                })
                .ajaxStop( function(){ 
                  $(this).animate({
                       top     : '-75px',
                       opacity : 0.1
                   }, 500);
                });