-1

我有这个<li>，当你点击它时，它会<li>在它之前创建另一个（应用了一堆类），这一切都很好。问题是，我无法修改（通过 jQuery）新创建的<li>元素，因为它们是动态创建的。

目前，它设置为：

 $(".foo").on("click", function() {
//Blah blah blah
});

而且我已经尝试了下面的代码，但仍然无法正常工作。

$(".foo").on("click", function() {
//Blah blah blah
});

提前感谢您的帮助！

4

5 回答 5

1

由于 li 是为 jQuery v1.7 动态创建的，因此现在和将来都会为匹配当前选择器的所有元素附加一个事件处理程序。

$(document).on("click", ".foo", function() {
    //Blah blah blah
});

本质上，如果您使用的是 1.7 及更高版本，则on的语法略有不正确。

于 2013-02-03T10:59:15.873 回答
0

jQuery 1.7+

我认为它应该与以下on()功能一起使用：

$(".foo").on('click', function() {
    // more code
});

其他

$(".foo").live('click', function(){
    // more code
}
于 2013-02-03T10:50:00.280 回答
0

将事件绑定到已经存在的父元素：

$('#parent').on('click', '.foo', function() {
    ...
});

'#parent'可能是您<ul>元素的选择器。

于 2013-02-03T10:51:56.023 回答
0

试试这个方法：

  $("ul").on('mouseup', '.item', function() {
    $(this).toggleClass("completed");
  });

JS 小提琴演示。

您遇到的问题是元素在事件绑定到它们.item的点不存在于 DOM 中。mouseup这种方法将 绑定mouseup到确实存在的 ，并使用该ul方法来侦听该事件，如果目标元素与传递给该方法的选择器 ( ) 匹配，则它实现匿名函数（传递给该方法的第三个参数）。on().item

如果目标与该选择器不匹配，则事件要么什么都不做，要么继续通过祖先传播。

于 2013-02-03T11:32:17.577 回答
0

这对你有用吗？：

$(function() {

  var task =
    $('<li class="editable todo-item">Double Click to Edit</li>');

  $(document).on('click', '.todo-new', function() {
    $('.todo-new').before(task);
  });

  $(document).on('dblclick', '.todo-item', function() {
    $(this).toggleClass("todo-completed");
  });

});
于 2013-02-03T11:35:05.937 回答