Question

我在下面有这段代码。

$('body').on('submit', '.some-form', function (event) {
    $(this).ajaxSubmit({
        dataType: 'json',
        success: function (data, statusText, xhr, form) {
            var url = 'some/url';

            // Reload the form markup/DOM using the response
            $.ajax({
                dataType: 'html',
                type: 'get',
                url: url
            }).done(function (html) {
                // get markup from url and replace the form markup ...    
            });
        },
        error: function () {
            alert('error');
        }
    });

    return false; 
});

基本上我在这里做的是

提交并处理表格
获得结果
如果成功，从页面获取新表单标记，然后替换当前表单标记。如果失败，则显示错误

现在，因为我将提交事件委托给了正文，所以不应该有问题处理新加载的表单标记上的提交。

函数处理程序正常工作，直到我看到此错误

TypeError: $(...).ajaxSubmit is not a function

error: function () {

知道为什么会这样吗？这意味着ajaxSubmit不存在但我没有重新加载页面。

编辑：是的，我正在使用jquery form plugin

Answer 1

我的钱如下：

在您的HTML请求中：

// get markup from url and replace the form markup ...

您正在加载包含jQuery库的完整页面。当你这样做时，HTML响应中的新jQuery脚本将被下载解析并执行，它将覆盖当前的jQuery原型，这意味着jQuery.ajaxSubmit不再可访问。

非常聪明，嗯？

解决此问题的最佳方法是简单地不要求包含jQuery脚本的整个页面，而是请求只包含所需DOM结构的URL，而不是包含页眉，页脚，脚本的完整页面，等。

AjaxSubmit不是DOM重新加载的函数

1 个答案: