通过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的输入时,会出现带有"Click"的警告吗？好不显示,代码永远不会执行,没有错误触发,所以我不知道什么是错的.我用其他代码测试并得到相同的结果:

$('#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   
});