Question

我为在我的应用程序上创建的每个表单创建了一个提交函数。它类似于下面写的那个。

$('form').submit(function(){
  //Some variable declaration
  $.ajax({
   type:'post',
   url:'someurl',
   data:formdata
   success:function(){
     console.log('form submitted');
   }
  });
});

毫无疑问，这样可行。现在，对于其中一种形式，我希望在收到响应后更新某个元素，类似于此。

$('#customform').submit();
console.log('custom form submitted');

所以在这种情况下，我想要提交消息＆＃34;提交自定义表单＆＃34;只有在提交表格后才能打印＃39;消息打印到控制台（同步加载）。有人帮忙吗？

Answer 1

只需将代码包含在成功函数中：

success:function(){
  console.log('form submitted');
  console.log('custom form submitted');
}

您还可以添加完整功能，因此无论错误还是成功，代码都会运行：

success:function(){
  console.log('form submitted');
},
complete: function() {
  console.log('custom form submitted');
}

正如@Tomalak在评论中提到的那样，现代化的方式：

var jqxhr = $.post( "example.php", function() {
  alert( "success" );
})
.done(function() {
  alert( "second success" );
})
.fail(function() {
  alert( "error" );
})
.always(function() {
  alert( "finished" );
});

可以在这里阅读更多内容：jQuery.post( ) .done( ) and success:

Answer 2

我会在表单完成提交后取消$("form").submit eventlistener，并在其中添加一个自定义函数

$("form").submit(function(){
    $.ajax({
        type:"post",
        url:"someurl",
        data:formdata,
        success:function(){
            console.log("form submitted");
            $("form").off("submit");

            $("#customform").submit(function(){
                $.ajax({
                    type:"post",
                    url:"someurl",
                    data:modifiedFormdata,
                    success:function(){
                        console.log("custom form submitted");
                    }
                });
            }); 
        }
    });
});

jQuery - 同步执行2个函数

2 个答案: