Question

我有像这样的HTML代码

<iframe id="myframe">
    <ul>
        <li>
            <a href="" class="add-section">add section</a>
            <div>...</div>
        </li>
     <ul>
</iframe>

单击“添加部分”链接时，包含此（添加部分）链接的parrent <li>将被复制并插入，并且代码将变为如此。

<iframe id="myframe">
    <ul>
        <li>
            <a href="" class="add-section">add section</a>
            <div>...</div>
        </li>
        <li>
            <a href="" class="add-section">add section</a>
            <div>...</div>
        </li>
     <ul>
</iframe>

我使用这个jquery代码来实现这一点并且它工作正常。

$($("#myframe").contents().find('.add-section')).on("click",function(e){
    e.preventDefault();

    $(this).parent().after("<li>"+$(this).parent().html()+"</li>");

});

我的问题是，当我点击新创建的（添加部分）链接时，代码将不会执行。

我的问题是如何将click事件添加到iframe中最新添加的元素。

提前致谢。

Answer 1

尝试将事件绑定到body元素，然后使用像

这样的事件委托

$("#myframe").contents().find('body').on("click", '.add-section', function (e) {
    e.preventDefault();
    $(this).parent().after("<li>" + $(this).parent().html() + "</li>");
});

将事件添加到动态添加到iframe内的元素

1 个答案: