0

我的html：

<div style="top:10px;display:block" class="jPlugin_article_pager">
    <span style="cursor:pointer" class="jPlugin_article_page" data-id="1">1</span>
    <span style="cursor:pointer" class="jPlugin_article_page" data-id="2">2</span>
</div>

我的jQuery

  $('.jPlugin_article_pager').on('click','.jPlugin_article_page',function(event){
            alert('works');
                console.log($(this).attr('data-id') + ' was pressed. Details:  Event target : '+ event.target+ '. Type:' + event.type );
});

我只想在您单击 jPlugin_article_page 元素时触发警报。笔记。jPlugin_article_pager 是动态生成的，所以 jPlugin_article_page。我不需要使用文档就绪功能，因为我的代码靠近结束正文标记..

我想知道什么是错的..谢谢

更新：

奇怪的是..我不知道我改变了什么，但这有效：

    $('.jPlugin_article_pager').on('click','.jPlugin_article_page',function(event){
                 alert($(this).attr('data-id'));
                console.log($(this).attr('data-id') + ' was pressed. Details:  Event target : '+ event.target+ '. Type:' + event.type );
            });
4

2 回答 2

2

该事件仅绑定到调用代码时实际存在的东西。您似乎确定您不需要文档准备功能，当然，但是当您访问此代码时，屏幕上的实际 DOM 元素是吗？

你说它是动态生成的，所以我猜它不是。而且你不能将函数绑定到不存在的对象上。在您动态添加对象后调用此代码，例如在实际创建对象的同一函数中。

于 2012-07-14T14:21:10.477 回答
1

由于.jPlugin_article_pager是动态创建的，您应该从另一个静态父级（如 body 标签）委托事件，试试这个：

$('body').on('click', '.jPlugin_article_page', function(event){
    alert('works');
    console.log($(this).attr('data-id') + ' was pressed. Details:  Event target : '+ event.target+ '. Type:' + event.type );
});
于 2012-07-14T14:21:19.103 回答