jQuery .click()不会在使用.wrapInner()动态创建的链接上触发

Question

我遇到了这个剧本的问题,对于我的生活,我无法弄清楚它有什么问题.快速浏览我的内容:

HTML:

<ul>
    <li id="wildcard_1">
        <div>
            <a href="#">test</a>
        </div>
    </li>
</ul>
<a href="#" class="reset">reset</a>

jQuery:

// Main function
$("[id^=wildcard_]").children('div').children('a').click(function() {
    $(this).replaceWith($(this).text());
});

// Temporary reset function
$("a.reset").click(function() {
    $("[id^=wildcard_]").children('div').wrapInner('<a href="#"></a>');
});

"测试"链接正常工作,因为它应该是第一次被点击 - 它被转换为纯文本).为了不在这里粘贴大部分脚本,我创建了一个临时函数,它将包装内容div,将"test"纯文本转换回链接.这就是它变得混乱的地方 - .click()第一个函数的监听器将不再触发这个动态创建的链接,而FireBug不会抛出任何错误或警告.

你也可以在JSfiddle上看到这个:http://jsfiddle.net/rWz69/

任何有关这方面的帮助都将不胜感激!

Answer 1

您可以使用.live()处理程序,如下所示:

$(document).on("click", "[id^=wildcard_] > div > a" , function() {
  $(this).replaceWith($(this).text());
});

这是你的小提琴示例更新/使用上面的代码 :)