使用jQuery拦截表单提交

intercept form submit with jQuery

本文关键字：表单提交 jQuery 使用      更新时间：2023-09-26

我想通过jQuery拦截提交，并首先检查服务器上是否存在文件。如果它存在，则继续请求，如果不存在，则显示消息并不发送请求。这就是我所拥有的：

$("#methodForm").submit(function(e){
    checkIndex('upload/segments.gen').done(function() {
        return true;
    }).fail(function () {
        e.preventDefault();
        alert("No index present!");
        return false;
    });
});

这是checkIndex():

function checkIndex(file){
    return $.ajax({
        url : file,
        type:'HEAD'
    });
}

结果是：文件存在于服务器上，但checkIndex返回fail。首先我看到警报弹出，然后它继续向服务器发送发布请求。

我也将checkIndex()用于其他目的，因为它的工作方式与预期的一样，所以我很确定错误在提交例程中。但是我找不出它出了什么问题。

您不能从回调返回到异步方法（如ajax）。相反，请阻止所有提交，然后在准备好后提交。

$("#methodForm").submit(function(e){
    e.preventDefault();
    var form = this;
    checkIndex('upload/segments.gen').done(function() {
        form.submit(); // submit bypassing the jQuery bound event
    }).fail(function () {
        alert("No index present!");
    });
});

它并不是这样工作的，checkIndex是异步的，所以当它返回任何东西时，表单已经提交，返回语句也在不同的范围内，请尝试类似的方法：

$("#methodForm").submit(function(e){
    e.preventDefault(); //prevent submit
    var self = this;
    checkIndex('upload/segments.gen').done(function() {
        self.submit(); //submit if ajax OK
    }).fail(function () {
        alert("No index present!");
   });
});
相关文章：