jquery:在动态添加的 html 上使用 e.stopPropagation() 不起作用

Question

我有一个通过点击事件创建的 html 标签。
之后，我通过 jquery 动态添加另一个标签(span)。
我希望跨度不执行警报，怎么办？
(如果我点击“我是新文本” - 我不想发生任何事情)
您可以在这里测试:http://jsfiddle.net/r97AT/16/
我在这里所做的不起作用:

<b onclick="alert('q1')" id="q1" class="test">test</b>
<br>
<b onclick="alert('q2')" id="q2" class="test">test</b>
<br>
<b onclick="alert('q3')" id="q3" class="test">test</b>

$(document).ready(function () {
    $(".test").each(function () {
        $(this).append(function () {
            return $('<span id="newChild_'+$(this).attr('id')+'" style="color:red"> I am new Text</div>');
        });
        $('#newChild_' + $(this).attr('id')).live('click', function (e) {
            e.stopPropagation();
        });

    });
});

Answer 1

试试这个:

$(document).ready(function () {
    $(".test").each(function () {
        $(this).append( $('<span id="newChild_'+$(this).attr('id')+'" style="color:red"> I am new Text</div>').bind('click', function (e) {
            e.stopPropagation();
        }) );
    });
});