javascript - Jquery 事件委托(delegate)问题

Question

谁能告诉我哪里出了问题？ news_active 是一个静态 div，其他所有内容都是通过 ajax 调用加载的，没有任何内容会触发警报，很困惑？!

$('#news_active').load('ajax.php', function() {
    // Delete news active
    $('#news_delete').on('click', function() {
        var vNid = $('#news_delete').attr('data-nid').val();
        alert(vNid);
        //$('#news_active').load('ajax.php?nid='+vNid);
    });
});

按钮看起来像这样，有多个按钮加载了不同的 data-nid 值:

<button id="news_delete" data-nid="1">Delete</button>

Answer 1

由于 news_delete 是动态加载的，您需要使用 event delegation注册事件处理程序，如:

// New way (jQuery 1.7+) - .on(events, selector, handler)
$('#news_active').on('click', '#news_delete', function(event) {
    var vNid = $('#news_delete').data('nid');
    alert(vNid); 
});

另外，您的代码中获取data-nid属性值的方式不正确。

要么使用这个:

var vNid = $('#news_delete').attr('data-nid');  // No need of .val() here
alert(vNid);

或者仅此使用 .data()

var vNid = $('#news_delete').data('nid');  
alert(vNid);