在使用 JavaScript 添加到 DOM 的元素上使用 jQuery答案

【问题标题】：Using jQuery on elements that were added to the DOM with JavaScript在使用 JavaScript 添加到 DOM 的元素上使用 jQuery
【发布时间】：2014-03-25 18:16:16
【问题描述】：

我有一个涉及接口级 jQuery 的相当复杂的问题。我正在使用 JavaScript 为我的页面加载 HTML，然后在页面加载后我使用 jQuery 来监听几个类的按钮点击。基本上，Sockets 会发出一个页面名称，然后 JavaScript 会填充我的页面。

问题是，jQuery 不响应我在 JavaScript 代码的其他函数中创建的元素上的 click 事件（或任何事件）。例如：

套接字加载页面：

socket.on('loadpage', function (data) { 
    if (data.page == 'button') showButton(); 
});

function showButton() {
    $('.hook').html('<div class="container"><button class="btn"></button></div>');
}

后来……

$(function() {
  $(".btn").click(function() {
      console.log('click');
  }
});

这不会触发。

【问题讨论】：

标签： jquery socket.io

【解决方案1】：

为此使用委托

试试

 $(".hook").on("click",".btn",function() {
  console.log('click');
 }

【讨论】：

你不可能用一行来修复我的整个应用程序。