每次重復Ajax通話

Question

我有一個帶有表單的頁面。 該表單是通過document.ready循環中的jquery.load動態加載的。

$('#storico').load('bp/storico.php?az=<?php echo $id; ?>');

然后，我創建了一個委托事件來處理表單提交：

$(document).on('click','#update',function(e){
e.preventDefault();
var att_stor = $('#attivo_storico').val();
var pass_stor = $('#passivo_storico').val();
var az = <?php echo $id; ?>;
$.ajax({
        type: "POST",
        url: "bp/storico1.php",
        data: {attivo_storico: att_stor, passivo_storico: pass_stor, azione: az},
        success: function(data){
    data1=data.split("|");
    if(data1[0].trim() == "Successo"){ 
        $("#storico").empty().html('<center><p class="success">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');
    }else if(data1[0].trim() == "Errore"){
        $("#storico").empty().html('<center><p class="err">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');    
    }
    },
        complete: setTimeout(function(){$('.container').load('bp/businessplan.php?id=<?php echo $id; ?>');},3000)
    });
});

ajax調用就像一個超級按鈕一樣工作，並執行以下操作：

1. 提交表格並更新數據庫（沒有問題）；
2. 使用確認消息更新包含表單的div（沒有問題）
3. 重新加載容器div以使用新數據更新整個頁面（在頁面其他地方使用）

第一個循環工作完美。 第二次調用兩次，第三次調用四次，然后八次。 如果我在容器中加載其他內容，然后返回到此頁面，則再次從一個位置開始執行。 這個問題不會影響腳本的工作方式，但我想了解為什么它會重復調用（如Firebug所示）

提前致謝！

Answer 1

嘗試使用：

$(document).off().on('click','#update',function(e){
e.preventDefault();
var att_stor = $('#attivo_storico').val();
var pass_stor = $('#passivo_storico').val();
var az = <?php echo $id; ?>;
$.ajax({
        type: "POST",
        url: "bp/storico1.php",
        data: {attivo_storico: att_stor, passivo_storico: pass_stor, azione: az},
        success: function(data){
    data1=data.split("|");
    if(data1[0].trim() == "Successo"){ 
        $("#storico").empty().html('<center><p class="success">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');
    }else if(data1[0].trim() == "Errore"){
        $("#storico").empty().html('<center><p class="err">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');    
    }
    },
        complete: setTimeout(function(){$('.container').load('bp/businessplan.php?id=<?php echo $id; ?>');},3000)
    });
});

Answer 2

$(document).off('click','#update'); // off old click events
$(document).on('click','#update',function(e){
e.preventDefault();
var att_stor = $('#attivo_storico').val();
var pass_stor = $('#passivo_storico').val();
var az = <?php echo $id; ?>;
if(request && request.readystate != 4){
    request.abort();  // for abort last one
}
request = $.ajax({
        type: "POST",
        url: "bp/storico1.php",
        data: {attivo_storico: att_stor, passivo_storico: pass_stor, azione: az},
        success: function(data){
    data1=data.split("|");
    if(data1[0].trim() == "Successo"){ 
        $("#storico").empty().html('<center><p class="success">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');
    }else if(data1[0].trim() == "Errore"){
        $("#storico").empty().html('<center><p class="err">'+data1[1]+'</p></center>').animate({opacity:1}, 'slow');    
    }
    },
        complete: setTimeout(function(){$('.container').load('bp/businessplan.php?id=<?php echo $id; ?>');},3000)
    });
});