渲染js.erb部分时没有单击事件

Question

使用js.erb重新渲染部分时，dom会发生什么？我再也无法获得点击事件了。

基于this tutorial，我已经按照它重新渲染了一个js.erb部分工作正常。当我点击“cat.name”按钮（在链接页面上）时，在该页面上是另一个我正在收听点击事件但没有工作的按钮。

向下跑：

在索引页面上，单击事件有效。当我发出from_category请求时，不再有点击事件。那真的发生了什么？

HTML：

<button id="test" value="ok">click</button>

JS：

$( "#test" ).on("click", function(e) {
  console.log(e.target.value)
});

Answer 1

您单击事件不会绑定到您应该使用event delegation将事件冒泡到新创建的dom元素的新dom元素

$('body').on('click input keypress','.the_dynamic_element',function(){

});

Answer 2

无需在主体上绑定事件，您可以使用此格式将事件绑定到选择器

$(document).on('click', '#test', function(e) {
  console.log(e.target.value)
});