javascript - jquery 没用

Question

我使用 jquery：

$("a").click(function(event) {
    alert("true")
    var $d_id = $(this).attr("name").substring(2)
    var $d_link = 'd_' + $d_id

    $("#"+$d_link).html('<a href="javascript: void(0)" id="d_event_'+
        $d_id + '" name="d_' + $d_link + '" > <img src="/images/r.png" alt="r"></a>');
});

和html：

<div id=d_1></div>

当我第一次单击显示消息（true）并插入图片时，但当我再次单击时，消息不显示。为什么我第一次点击后看不到消息？

Answer 1

您的选择器不会按原样绑定到 DOM 准备好后创建的元素。您需要使用 . 绑定到静态父级.on()。

使用最简单的例子：

$("body").on('click', 'a', function(event) {
    alert("true");
    var $d_id = $(this).attr("name").substring(2);
    var $d_link = 'd_' + $d_id;

    $("#"+$d_link).html('<a href="javascript: void(0)" id="d_event_'+
        $d_id + '" name="' + $d_link + '" > <img src="/images/r.png" alt="r"></a>');
});

Answer 2

使用on委托事件...

$(document).on("click","a",function(event) {
     alert("true")
     var $d_id = $(this).attr("name").substring(2);
     var $d_link = 'd_' + $d_id;

     $("#"+$d_link).html('<a href="javascript: void(0)" id="d_event_'+
    $d_id + '" name="' + $d_link + '" > <img src="/images/r.png" alt="r"></a>');
});

在此处阅读有关on直接和委托事件的更多信息..