use ajaxStart and ajaxStop jquery methods only for some of requests

I use AjaxStart and AjaxStop jquery methods for show and hide a loading message when a request send via Ajax . like following code :

                $('<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);
                });

but I don't want this loading show for all requests and just show for some of specific request . are you have any Solution to the problem ?

separate the lines of code to create your loader images and bind ajax events

differentiate between the images that require ajaxStop/ajaxStart events and those which don't. Use CSS classes to differentiate between the images.

creating loader images for ajax events:

for ajax :

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

which dont require ajax :

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

bind your ajaxStop and ajaxStart events to the images having the 'ajax-img' class

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