Javascript 操作jQuery添加的元素

Javascript 操作jQuery添加的元素,javascript,jquery,Javascript,Jquery,我正在动态地向DOM添加一些元素 我想用jQuery的.click()函数来操作这些元素。但不知何故,DOM并没有触发.click()事件,对于动态添加的元素,它只对jQuery未添加的其他元素起作用 知道为什么吗?根据我的经验,您需要在动态添加元素后添加单击处理程序。如果单击功能绑定到动态添加的元素之前的元素,则新元素将不具有单击功能。这是事件委派的一个简单案例,意味着页面上动态添加的元素上的直接事件绑定不会在您的案例中获得事件,因此,您需要遵循事件委派的特定语法,如: $(staticPar

我正在动态地向DOM添加一些元素

我想用jQuery的.click()函数来操作这些元素。但不知何故,DOM并没有触发.click()事件,对于动态添加的元素,它只对jQuery未添加的其他元素起作用


知道为什么吗?

根据我的经验,您需要在动态添加元素后添加单击处理程序。如果单击功能绑定到动态添加的元素之前的元素,则新元素将不具有单击功能。

这是事件委派的一个简单案例,意味着页面上动态添加的元素上的直接事件绑定不会在您的案例中获得事件,因此,您需要遵循事件委派的特定语法,如:

$(staticParent).on(event, selector, callback);
这里,
staticParent
是保存动态添加元素的最接近的父元素,该元素可以是
div、table、form等。
事件是类似于
click
的事件,选择器是上下文中元素的类名或id,回调是事件发生时必须运行的函数

尽管
$(文档)
始终可用于委派事件。所以你可以这样做:

$(document).on('click', '.myElem', function(){
    alert('clicked.');
});

Ad Jai已经说你需要活动授权。在jQuery中,这可以通过以下方式实现: 我给你写了一个小例子:

$(document).on("click", "input[type='button']", function() {
    alert("clicked");
});

// add two buttons 
$("<input/>", {
    type: "button",
    value: "button"
}).appendTo("#buttonsHolder");

$("<input/>", {
   type: "button",
   value: "button"    
}).appendTo("#buttonsHolder");
$(文档)。在(“单击”、“输入[type='button']”上,函数(){
警报(“点击”);
});
//添加两个按钮
$("", {
键入:“按钮”,
值:“按钮”
}).附于(“#按钮夹”);
$("", {
键入:“按钮”,
值:“按钮”
}).附于(“#按钮夹”);
以下是JSFIDLE的工作原理:

谢谢@Jai它工作得很好,我非常理解;)不客气@Youssef。很高兴这对您有所帮助。请检查.on()的事件委派语法。