Question

我AJAXified commenting system所以当点击Post Comment按钮时，会调用ajax调用而不是原始表单提交。它工作正常，直到我用ajax的评论提交按钮刷新页面。假设我只刷新包含帖子和评论以及按钮的div。之后，不会触发ajax，而是使用原始的提交方式。

提交表单的javascript看起来像

jQuery('document').ready(function($){
    var commentform=$('#commentform'); // find the comment form

    commentform.submit(function(){
//  $('#commentform').submit(function(){

我尝试使用$('#commentform')而不是没有帮助的变量。

在加载新帖子的成功ajax之后，我尝试再次分配commentform变量。这也没有帮助。

通过ajax加载帖子的部分javascript

var $ = jQuery.noConflict();

$(document).ready(function() { 
    $(".mhomepage_item").bind("click", function(){ //bind a click event on a class with name = mhomepage_item

    $.ajax({
            type: "POST",
            url: mhomepage.ajax_url,
            data: { 
                action: "get_post", 
                type: $(this).attr('type'), 
                current_post_id: $('#post_container').attr('current_post_id')
                },
            success: function(response) {
                response_from_json = JSON.parse(response);

                $('#content_container').html(response_from_json['html']);
                commentform=$('#commentform');
     }
    });

    // }
});

即使通过ajax重新加载按钮，有人可以建议如何使bind形成提交按钮永久保留吗？

Answer 1

尝试事件委托：

$(document).on("submit","#commentform",function(){
    // action to perform after submit intent
});

通过使用委托事件处理程序，您可以轻松处理动态创建的元素，而无需执行重新绑定事件处理程序等操作。

您还可以将事件绑定到body或调用函数时可用的最近容器 ，以避免将更多级别冒泡到{{1 }}。你也可以在你的情况下尝试这个：

document

Documentation

Answer 2

相应地：jQuery binding click to a link after AJAX call

您必须绑定按钮才能在success回调中点击/提交事件。

你可以这样做：

success: function(response) {
      response_from_json = JSON.parse(response);

      $('#content_container').html(response_from_json['html']);
      commentform=$('#commentform');

      $('#commentform').bind("submit", function() { ... } );
}

如果绑定对象由ajax刷新，则.submit不起作用

2 个答案: