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元素绑定到函数

回答

相关问题