jquery - On() 没有找到前置的 HTML

Question

有几篇文章处理on()通过 JavaScript 添加的 DOM 元素，但没有一篇文章适用于我的情况。

在<li class="prepend"><a href="#">x</a></li>a 中添加之后<ul>，我似乎无法将事件附加到它。

JS：

$('.categories > li a').on('click', function(event){
    event.preventDefault();
    if ($(this).parent().is('.more')) {
        $(this).siblings('ul').prepend('<li class="back"><a href="#">&lt; ' + $(this).html() + '</a></li>')
    }  else if ($(this).parent().is('.back')) {
        console.log('it worked')
    }
})

HTML：

<ul class="categories">
    <li class="selected">
        <a href="#">1 Featured</a>
    </li>
    <li>
        <a href="#">1 Popular Genres</a>
    </li>
    <li class="more">
        <a href="#">1 My Rooms &gt;</a>
        <ul>
            <li><a href="#">2 Tristique Cras</a></li>
            <li><a href="#">2 Porta Etiam &gt;</a></li>
            <li><a href="#">2 Mattis Tortor</a></li>
            <li class="more">
                <a href="#">2 Cras Fermentum &gt;</a>
                <ul>
                    <li><a href="#">3 Tristique Cras</a></li>
                    <li><a href="#">3 Porta Etiam</a></li>
                    <li><a href="#">3 Mattis Tortor</a></li>
                    <li><a href="#">3 Cras Fermentum</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

即使是这个简单的事件也不会看到对具有类的元素的点击.back

$('a').on('click', function(event){
    event.preventDefault();
    console.log(this);
})

Answer 1

观看：http: //jsfiddle.net/lughino/8uzgd/

为了捕获页面加载后创建的元素，您需要以这种方式调用 on 方法：

$(document).on('click', '.categories > li a', function(event){

要了解更多信息，请查看文档