jquery - 未调用 jquery 类操作，如果设置 div 数据来自 POST

Question

我正在发布并获取数据以设置为 text_div：

<div id="text_div">
    {{file.text|safe}}
</div>

$.ajax({
    ...
    success: function(data){
        $("#text_div").html(data);
    }
});

text_div 有如下段落：

<p>xxx <a title="FOO" class="bar" href="#">foo</a> xxx xxx. </p>

返回数据可以是html，但不能调用链接动作。

$("a.bar").click(function(){
    alert('xxx');
});

奇怪的是，如果我用链接模式设置一个堆栈段落，就可以调用类动作。我通过 chrome 工具检查元素，静态段落与从 POST 请求获得的数据相同。

Answer 1

$("a.bar").click(function(){
    alert('xxx');
});

不起作用，因为您正在动态插入它。您需要使用以下.on()函数绑定点击事件：

$("#text_div").on('click', 'a.bar', function(){
    alert('xxx');
});