Question

我有以下代码在页面上显示div

<div id="all_users">

 <div id=user11 userid=11 class=innertxt><img src=images/images.jpg width=50 height=50>    
 <strong>User11</strong>
  <ul> <li>Email: user11@uaer11.com</li>
  <li> <input type=checkbox id=select11 value=11 class=selectit /></li>
  </ul> </div>
 <div class="float_break"></div>

  </div>

以下代码正常工作并打印“在日志窗口中测试”

         $('#all_users .selectit').click(function() {
         console.log("test");
         });

但是当我从下面的代码中添加div时，它没有显示“在日志窗口中测试”意味着此点击事件未激活

         var new_data_var = $('<div class="innertxt" userid="1" id="user1"> <img height="50" width="50" src="images/images.jpg"><strong>Test User 01</strong><ul><li>User ID: 1</li> <li>Email: user1@nodomain.com</li><li style="padding-top: 5px;"><input type="checkbox" class="selectit" value="1" id="select1"><label for="select1">&nbsp;&nbsp;Select it.</label></li></ul></div>');
       $('#all_users').append(new_data_var);

事件未被调用？

由于

Answer 1

您必须使用live（）：

将处理程序绑定到事件（如点击）所有当前 - 和未来 - 匹配元素。

例如：

$('#all_users .selectit').live('click', function() {
    console.log("test");
});

目前您正在使用click（）代表bind（）。

主要区别在于，与bind相反，live也适用于新创建的DOM元素。

Answer 2

live() 方法必须在那里做到：

  $('#all_users .selectit').live('click', function() {
    console.log("test");
  });

描述：将处理程序附加到所有匹配的元素的事件当前选择器，现在或在将来

来源： http://api.jquery.com/live/

Answer 3

您应该在创建dom元素后检查您对点击的绑定，或者将bind替换为live，其行为相似，但也会影响尚未存在的元素。

ps：应引用您的html属性值。例如，type=checkbox =＆gt; type="checkbox"

Answer 4

如果在创建输入框之前设置click事件，则不会注册click事件 - 它只会注册当时存在的DOM元素的click事件。您可以在调用$('#all_users .selectit').click(function() { ...之前创建输入框，也可以像其他人建议的那样使用live()函数创建输入框，这将为匹配选择器的所有元素和将来的所有元素附加click事件。 / p>

创建jquery后初始化div

4 个答案: