jquery - 无法获取点击链接的ID

Question

也许我疯了，但我无法获取<a>的ID正在单击的链接。 var为了安全起见，效果很好，并且 ID 属性中肯定有内容。我是不是漏掉了什么？

这是 PHP -

<span id="<?php echo $load_post_content_nonce; ?>">
    <a href="<?php the_permalink(); ?>" id="<?php the_ID(); ?>" class="read-more" target="_blank">Read more...</a>
</span>

这是 JS -

$(document).ready(function(){   

    $('a.read-more').live('click', function(e){

        e.preventDefault();

        var id = $(this).attr('id');
        var security = $(this).parent('span').attr('id');

    });

});

以下是其中一个链接的 HTML 输出 -

<span id="b494a85e81">
    <a id="6623" class="read-more" href="http://test.dynedrewett.com/warring-parents-told-to-face-up-not-fall-out-over-contact-with-children/">Read more...</a>
</span>

Answer 1

正如其他人指出的那样，从 jQuery 1.7 开始，.live() 已被弃用。即使在旧版本中，.delegate() 现在也是处理委托(delegate)事件的首选方法。对于更高版本，on() 是处理委托(delegate)事件的正确方法，如 jQuery docs for .live() 中所述。其中解释了如何移植到 .on()。

这确实适用于在 DOM 准备好后使用 AJAX 或其他方法动态生成的内容，但您必须使用正确的语法。要处理动态生成的 .read-more 链接的点击，请执行以下操作:

$(document).ready(function(){

    $(document).on('click', 'a.read-more', function(e) {
        e.preventDefault();

        var id = this.id;
        var security = $(this).parent('span').attr('id');
    });
});

<小时/>

在$(document).on('click', 'a.read-more', function(e) {...})中，您可以替换document 与任何 static 父元素(在绑定(bind)处理程序时存在的元素，并且保证“永远”存在，以便处理将来的点击。阅读更多 链接；文档深入解释了用法。

截至撰写本文时，jQuery 对象 does not have a property named id ;要访问元素的 ID，您必须:
- 使用 .attr( 'id' )
或
- 使用原生 DOM 元素的 id 属性:$(element)[0].id 或 element.id