Question

我有以下设置：

文档可以有多种形式。
当input字段上的输入发生变化时，jQuery将触发ajax个事件。并且input.data("checking", true)被调用。
ajax事件完成后，系统会调用input.data("checking", false)。

现在，我想制作一个自定义form submit，等待此input中的所有form位于input.data("checking") === true。

到目前为止，我的代码没有应用问题：

$(document).on("submit", "form", function(event) {


    event.target.checkValidity();
    event.preventDefault();
    event.stopPropagation();

    //TODO: prevent this when not everything is checked
    var dataSerialized = $(this).serialize();
    var service = $(this).attr("action");
    $.ajax({
        url: "services/" + service + ".php",
        data: dataSerialized,
        type: "POST",
        cache: false,
        success: function(html) {
            if (html == "1") {
                //TODO: load page from json callback
                //loadPage(onsuccess);
            }
            else {
                loadPage("error");
            }
        },
        error: function(html, message) {
            finalError(message);
        }
    });
});

在所有 ajax事件完成之前，我怎么能让这个功能等待（非阻塞！）？

Answer 1

假设创建一个函数checkDone，在true表单中的所有input.data("checking") == false返回input时，您可以这样做：

$(document).on("submit", "form", function(event) {
    event.target.checkValidity();
    event.preventDefault();
    event.stopPropagation();

    var that = $(this);
    var interval = setInterval(function() {
        if(checkDone(that)) {
            clearInterval(interval);
            var dataSerialized = that.serialize();
            var service = that.attr("action");
            $.ajax({
                url: "services/" + service + ".php",
                data: dataSerialized,
                type: "POST",
                cache: false,
                success: function(html) {
                    if (html == "1") {
                        //TODO: load page from json callback
                        //loadPage(onsuccess);
                    }
                    else {
                        loadPage("error");
                    }
                },
                error: function(html, message) {
                    finalError(message);
                }
            });
        }
    }, 500);
});

这样，如果您可以在验证所有输入后提交表单，则每0.5秒检查一次，如果是，则清除时间间隔并提交表单。

但我建议不要在提交后删除标准服务器端验证。

Javascript / jQuery等待变量true

1 个答案: