jQuery是否重複POST請求？

我做了一個網頁，通過jQuery發送數據到一個頁面。通過點擊「新建」可以複製表格。出於某種原因，提交功能會多次運行。如果我創建了三個表單，並在第一個表單上單擊「提交」，它將爲此創建三個表單。該表單然後被刪除。當我提交第二個表單時，它會創建兩個條目，等等。jQuery是否重複POST請求？

誰能告訴我下面的代碼有什麼問題嗎？

function listen() { 
$(".addBook").on('click', function() { 
    $(this).fadeOut("fast", function() { 
     $(this).parent().find(".loadingImg").fadeIn(); 
    }); 
    var target = $(this).parent(); 
    var title = $(target).find(".bookTitle").val(); 
    var author = $(target).find(".bookAuthor").val(); 
    var genre = $(target).find(".bookGenre").val(); 
    var barcode = $(target).find(".bookBarcode").val(); 
    var img = encodeURIComponent($(target).find(".coverSelect").val()); 
    var data = 'barcode=' + barcode + '&title=' + title + '&author=' + author + '&genre=' + genre + '&img=' + img; 
    $.post('addBook', data, function() { alert(title); }); 
    $(this).parent().parent().slideUp("med", function() { 
     $(this).remove(); 
    }); 
}); 
} 


//new form function 
function newBook(barcode) { 
var data = 'barcode=' + barcode; 
$.post('bookInfo', data, function(data) { 
    $('.accordion').append(data); //php script returns html for form 
    $('.accordion > dd').hide(); 
    $("#closeAccordion").show(); 
    listen(); 
}); 
}

謝謝！

來源

2013-03-28 Caleb

我們需要看到html和「新窗體」和「刪除窗體」功能。給定的代碼將與匹配它的html一起工作。 –

如果整個形式被複制，這是否意味着該按鈕/鏈接標記.addBook也被複制？如果是這樣的話，那麼所發生的事情是，當你點擊一個.addBook項目，它激發了頁面上的帶班.addBook所有項目。（只是一個猜測這就是爲什麼我不是做這一個答案。需要看每@ KevinB的評論更多信息。） – JasCav

「當你點擊一個.addBook項目，它激發了頁面上的帶班.addBook所有項目「。什麼？絕對不是。你能證實這一說法嗎？ –

要綁定重複事件，相反，只是使用事件代表團，這樣你甚至不需要調用listen()。

//function listen() { 
$(document).on('click', '.addBook', function() { 
    $(this).fadeOut("fast", function() { 
     $(this).parent().find(".loadingImg").fadeIn(); 
    }); 
    var target = $(this).parent(); 
    var title = $(target).find(".bookTitle").val(); 
    var author = $(target).find(".bookAuthor").val(); 
    var genre = $(target).find(".bookGenre").val(); 
    var barcode = $(target).find(".bookBarcode").val(); 
    var img = encodeURIComponent($(target).find(".coverSelect").val()); 
    var data = 'barcode=' + barcode + '&title=' + title + '&author=' + author + '&genre=' + genre + '&img=' + img; 
    $.post('addBook', data, function() { alert(title); }); 
    $(this).parent().parent().slideUp("med", function() { 
     $(this).remove(); 
    }); 
}); 
//} 


//new form function 
function newBook(barcode) { 
var data = 'barcode=' + barcode; 
$.post('bookInfo', data, function(data) { 
    $('.accordion').append(data); //php script returns html for form 
    $('.accordion > dd').hide(); 
    $("#closeAccordion").show(); 
    //listen(); 
}); 
}

注：
你應該用什麼選擇元素要附加形式，如.accordion選擇更換document。

$('.accordion').on('click', '.addBook', function() {....

來源

2013-03-28 19:18:02

謝謝，它的工作原理！ – Caleb

可能是在生成新表單時綁定按鈕。
當你這樣做時，你將綁定相同的事件到一個已經附加了點擊事件的按鈕。
然後，當你點擊所有的事件將運行。

使用click或on('click', ...阻止這種行爲。

Demo

來源

2013-03-28 17:56:02

用最古老的jQuery，您可以使用「活」和「（‘點擊’）」解決方案，但在此之前，你還需要「殺」與模具和取消綁定綁定。。

在1.9+版本的jQuery的「活（...」語法與「上（...」語法記住升級/更改的東西所取代

在（..語法用法：

$("#myButton").on("click", function(){ 
    alert("you call me!"); 
});

關於老結合的方法，你可以找到一些文檔的here.

來源

2013-03-28 18:04:34 huncyrus

jQuery是否重複POST請求？

回答

相關問題