繁体   English   中英

如何在此事件处理程序创建的元素的帮助下将元素动态添加到事件处理程序之外?

[英]How can I dynamicaly append elements outside the event handler with the help of an element created by this event handler?

我做了以下代码来澄清这个问题:

HTML:

<body>
<div class="static">This is a static div</div>
 <button class="add-dynamic-button">Click me to add a new button</button>
</body>

Js:

$(function(){
$('.add-dynamic-button').on("click",function(){
    $('body').append("<button class='dynamic-button'>Click me to add a dynamic div'</button>");
});
    $('.dynamic-button').on('click',function(){
        $('body').append("<div class='dynamic-div'>This is a dynamic div</div>");
});
});

这是要测试的jsfiddle: http : //jsfiddle.net/6ZN5J/

当我在第一个单击处理程序中有$('。dynamic-button')。on('click')处理程序时,可以添加.dynamic-div。 但是,当我将其放置在首次点击处理程序范围之外时(如上例所示),什么也没有发生。 我最初以为$ .on可用于尚未创建的任何DOM元素,但现在事实证明,如果$ .on已在DOM中或将$ .on放在其中,则它可用于相同类或类型的新元素。创建这些元素的功能。 您能否弄清楚为什么会发生这种情况,以及是否有方法允许在创建事件的处理程序之外的动态创建的元素上使用事件处理程序? 谢谢

$()是一个选择器。 它会找到文档中的元素或父元素,您在执行该操作时会从中执行整个查询。

如果您希望其他按钮绑定到click事件,则需要手动绑定它们:

 $('body').append("<button class='dynamic-button'>Click me to add a dynamic div'</button>")
         .on("click", ....);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM