.live函数工作得很好。

它用于向舞台动态添加元素。

$('#selectAllAssetTypes').live('click', function(event){
                    alert("BUTTON CLICKED");
                    $('.assetTypeCheckBox').attr('checked', true);
                });

干杯, Ankit。

对委托事件使用.on()方法

$('#staticParent').on('click', '.dynamicElement', function() {
    // Do something on an existent or future .dynamicElement
});

.on()方法允许你将任何想要的事件处理程序委托给: 当前元素或将来添加到DOM的元素。

注:不要使用.live()!从jQuery 1.7+开始，.live()方法已弃用。

原因:

在jQuery中，Click()事件直接绑定，仅当特定元素(Html代码)存在于页面(页面加载后)时，将事件处理程序附加到元素上。

动态元素是在javascript或jquery的帮助下创建的(不是在Html中)。

它不会考虑页面加载后创建的未来元素(Dynamic)。

因此，正常的单击事件不会在动态元素上触发。

解决方案:

为了克服这个问题，我们应该使用on()函数。On()可以为当前元素和未来元素委托事件。

委托事件的优点是可以将处理程序附加到将来要添加到文档中的元素。

注意:delegate()，live()和on()函数比DOM元素更有优势。从JQuery 1.7开始，delegate()和live()已弃用(不要使用它们)。

可以同时为当前和未来的元素委托事件。

你的代码应该是这样的

从$(document).ready中删除代码:

$(".test").click(function(){

  alert();

});

改变为:

$(document).on('click','.test',function(){

  alert('Clicked');

});

您遇到的问题是，您试图在DOM中有任何带有“test”类的东西之前将“test”类绑定到事件。虽然看起来这一切都是动态的，但真正发生的是JQuery传递DOM并在ready()函数触发时连接click事件，该事件发生在您在按钮事件中创建“click Me”之前。

通过将“test”Click事件添加到“button”单击处理程序，它将在DOM中存在正确的元素后将其连接起来。

<script type="text/javascript">
    $(document).ready(function(){                          
        $("button").click(function(){                                  
            $("h2").html("<p class='test'>click me</p>")                          
            $(".test").click(function(){                          
                alert()                          
            });       
        });                                     
    });
</script>

使用live()(正如其他人指出的那样)是另一种方法，但我觉得指出JS代码中的小错误也是一个好主意。你写的没有错，只是需要正确的范围。对于许多传统开发人员来说，掌握DOM和JS的工作原理是一件很棘手的事情。

Live()是一种更简洁的处理方法，在大多数情况下是正确的方法。它本质上是监视DOM，并在其中的元素发生变化时重新连接内容。

我正在使用表动态地添加新元素，当使用on()时，使它为我工作的唯一方法是使用一个非动态的父作为:

<table id="myTable">
    <tr>
        <td></td> // Dynamically created
        <td></td> // Dynamically created
        <td></td> // Dynamically created
    </tr>
</table>

<input id="myButton" type="button" value="Push me!">

<script>
    $('#myButton').click(function() {
        $('#myTable tr').append('<td></td>');
    });

    $('#myTable').on('click', 'td', function() {
        // Your amazing code here!
    });
</script>

这非常有用，因为要删除与on()绑定的事件，可以使用off()，而要使用一次事件，可以使用one()。

如果你有一个动态添加到某个容器或主体的链接:

var newLink= $("<a></a>", {
        "id": "approve-ctrl",
        "href": "#approve",
        "class": "status-ctrl",
        "data-attributes": "DATA"
    }).html("Its ok").appendTo(document.body);

你可以使用它的原始javascript元素并添加一个事件监听器，比如click:

newLink.get(0).addEventListener("click", doActionFunction);

无论你添加多少次这个新的链接实例，你都可以像使用jquery点击函数一样使用它。

function doActionFunction(e) {
    e.preventDefault();
    e.stopPropagation();

    alert($(this).html());
}

所以你会收到一条信息说

它的好

它比其他替代方案具有更好的性能。

额外:你可以获得更好的性能避免jquery和使用纯javascript。如果你使用的是ie8版本，你应该使用这个polyfill来使用addEventListener方法

if (typeof Element.prototype.addEventListener === 'undefined') {
    Element.prototype.addEventListener = function (e, callback) {
      e = 'on' + e;
      return this.attachEvent(e, callback);
    };
  }