Question

当我有：

$('#blah').on('click', function(){
    $.ajax({
        //blah
    })
});

我工作得很好，上面的代码只需要一次ajax请求，但是当我有：

$('body').on('click', '#blah', function(){
    $.ajax({
        //blah
    })
});

这个多次发送ajax请求，有时两次，有时更多。我必须使用第二个代码，因为#blah对象本身被另一个ajax请求添加到页面中，第一个代码不起作用。

有什么问题？我在代码的末尾也使用了return false;，但没有工作......。

我会感激任何帮助。

MORE INFO:

假设我有一个容器，容器内部有按钮，容器本身已经被早期的ajax请求加载，如：

$('a[rel="show_product_detail"]').on('click', function(){
        var product_id = $(this).attr('id');
        $('.companycontent').html('');
        $('.companycontent').addClass('members_content_loading');
        $('.companycontent').load('modules/companies/companies_tabs/product_details.php?product_id='+ product_id', function() {
            $('.companycontent').removeClass('members_content_loading');
        });
        return false;   
    });

现在在容器中我有另一个按钮导致容器的新内容，对于那些按钮我必须使用第二个代码，因为按钮是通过ajax加载的。现在通过单击容器内的按钮，ajax请求会多次发送（取决于容器重新加载的时间）。

Answer 1

在您的第一个请求中触发“成功”后，您将动态内容添加到页面中，完成后，将其绑定到点击侦听器的代码

$.ajax({
//...

success:function (data){
$(data).appendTo(".companycontent"); //inserts #blah
$("#blah").bind("click",function(){
//ajax code 
})

});

或者您可以在需要时构建新对象并创建实例

function AJAX(){
this.url="";
this.control="";
this.run = run;`
}

function run(){

$.ajax({

url:this.url,

success:function (data){
$(data).appendTo(".companycontent"); //inserts #blah
$("#blah").bind("click",function(){
//
});
}
});

最后获取新实例并初始化该对象。如果你更好地修改它，这个对象会非常好

var test= new AJAX();
test.url="myajax.com/ajax";
test.control=Get_news(); // for example a click event
test.run();

单击多个Ajax请求

1 个答案: