jQuery將新的.append元素綁定到函數

在此腳本中，目標是在單擊#packet時添加/生成元素'#sauce'，然後再次單擊#packet時'開啓'。jQuery將新的.append元素綁定到函數

到目前爲止，腳本創建了一個新的'#sauce'，然而新的'#sauce'沒有綁定到函數fireA（）。因此.on（'click'應該運行兩個功能，我認爲 - 首先啓動#sauce並將一個新的#sauce添加到#saucebox，這將成爲通過再次點擊觸發的下一個元素...基本上是彈藥重新加載:)

$(document).ready(function() 

    { 


$("#rip_tab").click(function() { 
     $(this).toggleClass("rip_tab_ripped"); 
    }); 


function fireA() { $("#sauce").removeClass("sauceWait").switchClass("sauce_hide", "sauce1", 200).switchClass("sauce1", "sauce2_fall", 400);} 


    $('#packet').on('click', function() { 
if ($('#rip_tab').hasClass("rip_tab_ripped")) 

    {  

    var events = [fireA]; 

    //declare counter 
    if(!this.counter) { this.counter = 0; } 

    events[this.counter](); 
    this.counter = (this.counter + 1) % 3; 

} 

    }); 


$(document).on('click','#packet', function() { 
$('#saucebox').append('<div id="sauce" class="sauce1 sauce_hide sauceWait sq1"></div>'); 
$fireA(); 
}); 

    });

如果我使用的初始 '#sauce' 它觸發，併產生另一個 '#sauce' 正確，但新#sauce不結合起作用fireA（）

<div id="saucebox"> 
<div id="sauce" class="sauce1 sauce_hide sauceWait sq1"></div> 
</div>

如果沒有初始'#sauce'點擊，則會正確生成另一個'#sauce'，但同樣，新的#sauce不會綁定到函數fireA（）

<div id="saucebox"> 
<div id="sauce" class="sauce1 sauce_hide sauceWait sq1"></div> 
</div>

來源

2012-07-27 Commandrea

使用jquery'on'綁定動態元素，綁定點擊正文並委託給您的元素。檢查文檔。 – sabithpocker 2012-07-27 23:45:02

什麼是$ fireA？ – sabithpocker 2012-07-27 23:51:52

您不能在文檔中多次使用相同的ID。您必須選擇其他ID或使用其他選擇器。 #sauce使用document.getElementById，它只會選擇第一個。 [id=sauce]應該選擇兩者，儘管從DOM角度來看它仍然是錯誤的。

來源

2012-07-27 23:59:07

jQuery將新的.append元素綁定到函數

回答

相關問題