使用jQuery提交ajax表单，并接收另一个使用jQuery提交的表单

Question

我正在创建一个应用程序，它将DOM对象作为子对象添加到另一个DOM对象，并且此子对象可以具有子对象。我正在使用表单提交和验证，如下所示。问题是，当我提交并接收AJAX响应时，我将新的表单添加到DOM，并且当它被提交时，它绕过initializeSubmit函数并加载一个新页面。

jQuery(document).ready(function($) { 
    $('#wpbody-content form').each(initializeSubmit); 
}); 

function initializeSubmit() { 
    var $ = jQuery, 
     $form = $(this), 
     options = { 
      submitHandler: function() { 
       var postdata = {}, 
        $inputs = $form.find('input, textarea'), 
        edit_fields = {}; 
       $inputs.each(function() { 
        // gather postdata 
       }); 
       $.ajax({ 
        type : 'POST', 
        dataType : 'html', 
        url : ajaxurl, 
        cache : false, 
        data : postdata, 
        success : function (response) { 
          $container = $form.parent(); 
          $container.after(response); 
          $newform = $(response).find('form'); 
          $newform.each(initializeSubmit); 
        } 
       }); 
      } 
     } 

    $form.validate(options); 
}; 

我也尝试过使用申请，而不是每一个成功的函数中：

initializeSubmit.apply($newform); 

控制台日志显示一个jQuery数组$ newform内的适当形式。任何帮助表示赞赏！

Answer 1

我认为问题在于$(response).find('form')创建了一个与$container.after(response);插入的不同的DOM变换response。

您需要确保.find('form')作用于实际插入的DOM节点。

尝试：目前为装载工作完美的网页

success : function (response) { 
    var $response = $(response); 
    $form.parent().after($response); 
    $response.find('form').each(initializeSubmit); 
}