jquery for loop cause更新按鈕多次觸發

Question

我有一些問題，我不知道如何實際解決它，基本上我會繪製出一個數據並追加到網絡中，併爲它分配每個數據都擁有div按鈕，被刪除和更新，每一次點擊將刪除所有與reappend數據，代碼是如下

function DrawData(){ var txtHd = $('input[id$="hidText1"]').val(); 
if (typeof(txtHd) != "undefined" || txtHd != "") //if have value 
{ 
    var sSplit = txtHd.split(sDelimiter); 
    var i; 
    var div1, div2, div3, div4, div5, row1, comment; 
    for (i=0;i<=sSplit.length-1;i++){ 
     if (sSplit[i].trim() == "") { return true; } 
     comment = ""; 
     iAdd1 = i + 1; 
     div1 = "<div class=container><div id=" + sSplit[i] +" class=number>" + iAdd1 + "</div>"; 
     div2 = "<div class=stage>Level " + iAdd1 + "</div>"; 
     div3 = "<div class=name>" + sSplit[i] + "</div>"; 
     div4 = "<div id=rem" + iAdd1 +" class=rem>remove</div>"; 
     div5 = "<div id=upd" + iAdd1 +" class=upd>update</div>";; 
     div6 = "<div class=drfm>Comment: " + comment + "</div></div>"; 

     row1 = div1 + div2 + div3 + div4 + div5 + div6; 
     $('#dtdr').append(row1); 
     $('#errmsg').fadeOut(); 
     removeValue(); //add remove function 
     updateValue(); //add update function into the div 
    } 
}} 

function updateValue(){ 
$('.upd').on('click', function(){ 
    var cLb=$('input[id$="hidText1"]').val(); 
    var updName = $(this).parent().find('.name').text(); 
    var repName = $('input[id$=fl_Approval]').val().trim(); 

    if (repName == ""){ $('#errmsg').text("Add error: [ Not allow to add empty name ]"); $('#errmsg').fadeIn(); return; } //check empty value 
    if (checkArrayDup(repName,cLb) == true){ $('#errmsg').text("Add error: [ Name: "+ repName + " exist in the list ]"); $('#errmsg').fadeIn(); return; } //check duplicate 

    updName = updName + sDelimiter; 
    repName = repName + sDelimiter; 
    var newVal= $('input[id$="hidText1"]').val().replace(updName ,repName); 
    $('input[id$="hidText1"]').val(newVal); 
    $('.container').remove(); 
    DrawData(); 
}); 

它做工精細，但現在的問題是，代碼效率不高，而且我沒有任何想法關於如何解決這個問題，for循環已經在更新按鈕上創建了多個點擊處理程序，所以每當我點擊按鈕，就像它說的那樣，我有5個數據，第一個數據將觸發5次點擊事件，第二個數據會觸發4次點擊事件，這些會持續到最後的數據和原因e檢查重複數據無法正常工作，有關如何解決此問題的任何想法？對不起，我可憐的英語，任何幫助將是偉大的

Answer 1

會使用事件代表團爲你工作？相反，對上.UPD股利分配的事件處理程序，你可以這樣做：

$('#dtdr').on('click', '.upd', function(e) { console.log(this); # --> .upd div }); 

這將click事件委託給#dtdr DIV，這應該已經存在。當有人點擊div時，它會檢查點擊來自.upd div並執行該功能。這樣，當添加行時，您永遠不必分配新的事件處理程序。