Question

我试图将一些简单的逻辑包装到javascript / jquery闭包中以将表单绑定到jQuery validate。正常代码看起来像这样......

// attach the jquery unobtrusive validator
$.validator.unobtrusive.parse("#formName");

// bind the submit handler to unobtrusive validation.
$("#formName").data("validator").settings.submitHandler = function() {
    viewModel.Save( $("#formName" ) );
};

精彩地工作。我只是想把它包起来，让它变得更干净。所以我写了这个。

(function ($){
    $.fn.submitHandler = function(callback){
        var container = $(this);
        // attach the jquery unobtrusive validator
        $.validator.unobtrusive.parse(container);

        // bind the submit handler to unobtrusive validation.
        $(container).data("validator").settings.submitHandler = callback(container);
        return true;
    };
})(jQuery);

所以不可避免的目标是我将来可以做到这一点。

$("#formName").submitHandler(function (e) {
        viewModel.Save(e);
    });

我知道这看起来很傻，但我认为这是一个了解更多的好机会。我刚刚学习了Javascript闭包，并希望尝试一下，这对测试它感觉是件好事。

问题是，如果我创建一个HTML表单并尝试将其绑定到它，它确实像我想要的那样工作......但它可以工作两次。首先，表单只是在页面加载时“发布”，然后它会执行我想要的行为并在此之后进行预期。

修改

当我说“发布”表单时，我的意思是alert函数中的Save对话框会触发。没有APPEAR可以回任何服务器。

这是我用来测试它的表单。

<form id="_formName" action="" method="post">
    <input type="text" required="required" />
    <button type="submit">Submit</button>
</form>

<script type="text/javascript">
    var viewModel = {
        Save: function ($form) {
            alert($form.attr('id'));
        }
    };

    $("#_formName").submitHandler(function (e) {
        viewModel.Save(e);
    });

</script>

Answer 1

我相信你的问题在于这一行：

// bind the submit handler to unobtrusive validation.
$(container).data("validator").settings.submitHandler = callback(container);

这里你打算将函数引用分配给“submitHandler”属性......但是，你实际在做的是调用该函数带有参数“container”的“回调”，并将该评估表达式的结果分配给“submitHandler”属性......我不相信你打算这样做。

你可以试试这个（记住，我真的不知道你的情况的具体情况，我只是推断我可以推断的）：

// bind the submit handler to unobtrusive validation.
$(container).data("validator").settings.submitHandler = function() { callback(container); };

Javascript闭包 - 表单提交在我告诉之前被触发

修改

1 个答案: