2011-07-11 46 views
0

我有幾個元素在類中有一個點擊事件附加到他們。這會調用一個帶有鏈接的彈出框。該鏈接使AJAX調用將原始元素ID存儲在數據庫中。退出嵌套函數

問題是,如果你打開一個元素上的彈出窗口並關閉它,然後在另一個元素上做同樣的事情,它會做出兩個單獨的AJAX調用。當點擊鏈接隱藏彈出窗口時,我需要一種方法來退出被調用的原始函數。這樣一次不會發出多個AJAX呼叫。

下面是我的問題的一個基本的例子:

$(".ulElement").live('click', function(){ 
    $('#popup').css('visibility','visible'); 
    var elementNum = $(this).parent().attr('id'); 
    $('#popupLink1').click((function() { 
     //make Ajax call and send elementNum 
    }); 
    $('#popopLink2').click((function() { 
     $('#popup').css('visibility','hidden'); 
     //I need to exit the function that was called by ulElement here 
    }); 

編輯:這是我的代碼簡單,我需要工作。現在,它仍會將我點擊的每個元素變成灰色。

$(".position").live('click', function(event){ 
    $('#seatmenu').css('visibility','visible'); 
    var seatnum = $(this).parent().attr('id'); 

    $('.stand').css('visibility', 'visible'); 
    $(".menuhead").click(function(){ 
     clearMenu();    //this just hides the menu 
     event.preventDefault(); 
    }); 


    $(".stand").click(function(){ 
     clearMenu(); 
     $('#'+seatnum).css('color','grey'); 
    }); 
}); 
+1

一旦一個AJAX調用過程中,你可以* *取消,但在技術上的要求已經作出。您將需要處理它的失敗或分開結束。如果需要的話,只是解僱返回的信息。 – Orbling

回答

0

正如Orbling說,一旦它已經讓你無法取消一個AJAX調用。 如果你想阻止用戶多次調用AJAX服務,你可以簡單地存儲一個變量來記錄用戶是否通過聲明一個全局變量來點擊它。例如

var hasUserClickedPopup = false; 

$(".ulElement").live('click', function(){ 
    $('#popup').css('visibility','visible'); 
    var elementNum = $(this).parent().attr('id'); 
    $('#popupLink1').click((function() { 
     if(!hasUserClickedPopup) 
     { 
      //make Ajax call and send elementNum 
      hasUserClickedPopup = true; 
      } 
    }); 
    $('#popopLink2').click((function() { 
     $('#popup').css('visibility','hidden'); 
     //I need to exit the function that was called by ulElement here 
    }); 
0

您實際上可以放棄現有的XHR呼叫。

只需將$.ajax調用存儲在一個變量中,該變量可以在頂部聲明。然後您可以在發出另一個請求之前取消它。

var xhr; 
$('.button1").click(function() { 
    if(xhr == null) { 
     xhr = $.ajax(...); 
    } 
    else { 
     xhr.abort(); 
    } 

}); 

$(".button2").click(function() { 
    if(xhr == null) { 
     xhr = $.ajax(...); 
    } 
    else { 
     xhr.abort(); 
    } 
});