2016-03-28 48 views
0

我有一個load.gif,每次用戶進行AJAX強力搜索時啓動。但是,我有一些搜索字段會在用戶輸入時自動顯示建議,這些字段也由AJAX提供支持。將ajaxStart函數限制爲2個ajax函數中的1個

現在我的loads.gif出現在用戶搜索以及搜索建議,而打字。如何限制顯示loading.gif的函數僅在用戶使用AJAX搜索時顯示,而不能在輸入AJAX搜索時顯示搜索建議?

這是我的函數:

1)添加一個全局變量,如showLoadingAnimation並將其設置爲取決於true或false:

$(document).ajaxStart(function() { 
    $(".se-pre-con").fadeIn("fast"); 
}).ajaxStop(function() { 
    $(".se-pre-con").fadeOut("fast"); 
}); 
+0

怎麼樣將其綁定與條件一樣,如果用戶是STI如果用戶不在搜索輸入或搜索輸入的第一個聯繫人,然後顯示load.gif –

+0

你是什麼意思與「綁定條件,如果用戶是仍然在搜索輸入「 – mesqueeb

+0

請看我的答案。 –

回答

0

如何將其與條件綁定,如用戶仍然在搜索輸入然後不顯示loading.gif其他如果用戶超出搜索輸入或搜索輸入的第一個接觸然後顯示loading.gif(下面參考)

第一全局變量

var input_focus = false; 

,然後當指定的輸入是焦點

$("#specified_input").focus(function(){ 
    //set the variable named 'input_focus' to true to reject the showing of the loader (loading.gif) or hide it. 
    input_focus = true; 
}).blur(function(){ 
    //when the specified input lose it focus then set the variable 'input_focus' to false so that the loader (loading.gif) is allowed to show 
    input_focus = false; 
}); 

$.ajax({ 
    url : 'my-url', 
    type : 'post', 
    data : {}, 
    beforeSend : function(){ 
     //check if input is on focus 
     if(input_focus !== true){ 
      //show the loading.gif, assume that #loader 
      $("#loader").show(); 
     }else{ 
      //hide the loading.gif, assume that #loader 
      $("#loader").hide(); 
     } 
    }, 
    complete : function(){ 
     //when the ajax request is complete 
    }, 
    success : function(response){ 
     //the response function 
    } 
}); 
0

我想通過以下任一解決它需要。在您ajaxStartajaxStop做到以下幾點:除了更改jQuery的全局設置的

$(document).ajaxStart(function() { 
    if (showLoadingAnimation) $(".se-pre-con").fadeIn("fast"); 
}).ajaxStop(function() { 
    if (showLoadingAnimation) $(".se-pre-con").fadeOut("fast"); 
}); 

2),總結了jQuery方法用自己的方法:

//only listen to ajaxStop event so that we can hide the animation 
$(document).ajaxStop(function() { 
    $(".se-pre-con").fadeOut("fast"); 
}); 

function myAjax(params, showAnimation) { 
    if (showAnimation) $(".se-pre-con").fadeIn("fast"); 
    $.ajax(params); 
} 

//in your code you instead of calling $.ajax({...}) simply use `myAjax({...})` 

希望這有助於。

相關問題