从表单提交执行脚本

Question

当使用 button 时这有效（加载器显示直到页面加载）：

<script>
    $(document).ready(function(){
        $(".loader").hide();
        $(".overlay").fadeOut(1000);

        $('button').click(function() {
            $(".loader").fadeIn("fast");
            $(".overlay").fadeIn(100);
        });
    }); 
</script>

但是如果我使用 Submit 它不会：

我正在尝试以下操作：

<script>
    $(document).ready(function(){
        $(".loader").hide();
        $(".overlay").fadeOut(1000);

        $("form").submit(function() {
            $(".loader").fadeIn("fast");
            $(".overlay").fadeIn(100);
        });
    }); 
</script>

我也试过不欢而散：

$(input[type="submit"]).click(function() {

我希望它适用于页面上的所有提交，因此不想使用 ID。欢迎任何指点。

更新

$("form").submit(function(e) {

成功了。

Answer 1

您必须阻止表单的默认行为，否则它会提交（并且浏览器将切换到下一页[表单中的操作]）。

要禁用 submit 操作，您需要在 submit/click 函数中使用 event.preventDefault()。

如果您确实需要提交表单 - 您可以添加一个变量来检查提交是否已被阻止，并根据该变量来阻止（或在 submit 函数中提交表单）：

var submitPrevented = false;
$("form").submit(function(e) {
    if (!submitPrevented) {
        submitPrevented = true;
        e.preventDefault()
    }
    $(".loader").fadeIn("fast");
    $(".overlay").fadeIn(100);
    var that = this;
    setTimeout(function() {
        that.submit();
    }, 1000);
});

Notice that I added the e element as a parameter to the function.

关于您上次编写的代码 - 那里存在语法错误。这是正确的语法：

$('input[type="submit"]').click(function() {

从表单提交执行脚本

Executing script from from submit

html

jquery

submit