0

我正在创建一个应用程序，它将一个 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);
};

我还尝试在成功函数中使用 apply 而不是 each：

initializeSubmit.apply($newform);

控制台日志显示了 $newform 的 jQuery 数组中的适当表单。任何帮助表示赞赏！

4

1 回答 1

0

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

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

尝试：

success : function ( response ) {
    var $response = $(response);
    $form.parent().after($response);
    $response.find('form').each(initializeSubmit);
}
于 2012-12-02T23:08:13.230 回答