ajax - 通过 ajax 加载的 Html 不适用于 jQuery 事件

Question

我在一个名为 checkout.tpl 的文件中有这段代码，还有一个 Javascript 代码，我将在下面评论：

$.ajax({
    url: 'index.php?route=checkout/payment_address',
    dataType: 'html',
    success: function(html) {
        $("#checkout").hide();
        $('#payment-address .checkout-content').html(html);
    },
    error: function(xhr, ajaxOptions, thrownError) {
        alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
    }
});

正如您在此处看到的，我使用 AJAX 加载了一些 HTML 内容。这是我正在加载的HTML 内容。注意id=button-payment-address的输入。所以在 checkout.tpl 我有这个 jQuery 代码：

$('#button-payment-address').on('click',function() {
    alert("Click");
    // here goes some code   
});

当我单击带有id=button-payment-address的输入时，是否应该出现带有“单击”的警报？那么没有显示并且代码永远不会执行，没有错误被触发所以我不知道出了什么问题。我用这个其他代码测试并得到相同的结果：

$('#button-payment-address').click(function() {
    alert("Click");
    // here goes some code   
});

// This seems to be not working with latest jQuery and generates a error
$('#button-payment-address').live('click', function() {
    alert("Click");
    // here goes some code   
});

有什么帮助吗？

Answer 1

尝试这个

$('#payment-address').on('click','#button-payment-address',function() {
    alert("Click");
    // here goes some code   
});