Question

我最近问了一个问题[ here ]，但这并没有给我一个答案。这就是我想要做的事情，你可以看到我第一次尝试上面的链接：

用户提交表单
停止默认提交操作
检查数据库中是否存在类似的条目
1. 如果确实，则会显示一条通知，询问他们是否要提交，并提供让他们提交的选项（启用默认操作并提交）。
2. 如果不是，请在表单上启用默认操作并提交

我很茫然。任何帮助表示赞赏。谢谢帮派。

为Simeon编辑：以下是我在解决方案中使用的代码：

var forceSubmitForm = false;
$('#purchaser_contact').submit(function(){

  if(forceSubmitForm) return true;

  if( $("#id").val()=="" ){

    if( $("#fname").val()=='' || $("#city").val()=='' ){ alert('First Name and City are required fields. Please fill these in before continuing.'); return false; }

      $.ajax({
        type: "POST",
        url: 'ajax/contactSearch.php',
        data: ({ fname: $("#fname").val(), lname: $("#lname").val(), city: $("#city").val(), state: $("#state").val() }),
        success: function(d) {
            var obj = JSON.parse( d );
            if(obj.result != 0){
            $("#contactSearch").remove();
            $("#button-wrapper").before('<div id="contactSearch">'+obj.result+'</div>');
            $("#contactSearch").slideToggle('slow');                                
          } else {
            forceSubmitForm = true;
            $('#purchaser_contact').submit(); // Form will submit
          }
        }
      });   

      return false;

  } //END IF empty id

});

在第二次按下提交按钮（即$('#purchaser_contact').submit();未提交表单）之前，这将无效。

编辑这从来没有对我有用，但Simeon的答案是最接近的，他声称它适用于所有主流浏览器，所以如果它对某人有帮助，那很好。

Answer 1

这是您正在寻找的解决方案。

var forceSubmitForm = false;
$('#myForm').submit(function(){
    if(forceSubmitForm) return true;
    $.ajax({
        // ...
        success: function(data){
            if(data.entry != 'OK'){ // or whatever check
                forceSubmitForm = true;
                $('#myForm').submit(); // Form will submit
            }else{
                // Form will not be submitted
            }
        }
    });
    return false;
});

修改为了证明这种方法有效，我刚刚创建了一个带有表单和提交按钮的示例页面。这在所有主流浏览器中都运行良好：

$(function(){ // On DOM ready var forceSubmitForm = false; $('#purchaser_contact').live('submit', function() { if (forceSubmitForm){ alert('submitting'); return true; } // A callback function works in the same manner as a timeout setTimeout(function(){ forceSubmitForm = true; $('#purchaser_contact').submit(); }, 1500); // Submit after 1,5 seconds return false; // Do not submit immediately }); });

Answer 2

您可以通过向submit事件添加回调函数来处理表单。如果你想停止提交，你可以在事件上使用preventDefault（）或返回false。

$('form').submit(function(event) {
   event.preventDefault();

   //do stuff, you can put your ajax call here
   ...

   if(fail) { return false; }
   else { return true; }
});

Answer 3

这是jQuery示例（未经测试）：

$(function() {
    $("#myForm").submit(function() {
        $.post(/* make AJAX request */ function() {
            if (/* similar entry does not exisits */) {
                 $("#myForm").data("allow-submit", true).submit();
            } else {
                 alert('NOT ALLOWED!');
            }
        });

        return $(this).data("allow-submit") || false; // prevent form submit if not allowed
    });
});

Answer 4

基本上，您希望在提交表单时运行函数，然后在函数为负数时短路表单操作。这样的事情应该做：

$("form#myForm").submit(function(){
    if(someCustomFunction()){//do the check
            event.preventDefault; //short circuit
            someOtherCustomFunction();//display your alternative

    }
});

Answer 5

这让我疯狂，没有任何解决方案正在运作，它要么不提交表格，要么进入提交表格的无限循环。所以我只是将提交按钮变为常规按钮。然后在ajax循环中提交表单。这意味着您不必担心停止提交按钮的默认操作，因为它只是一个常规按钮。

<form id="loginForm" method="post" action="login.php">
<input type="text" name="username" id="username">
<input type="button" value="Log in" id="btnDoSomething">
</form>

和Javascript / jQuery：

$("#btnDoSomething").click(function() {

    var request = $.ajax({
        data: {username: $("#username").val()},
        dataType: 'json',
        success: function(data)
        {
            // when response is returned do stuff then submit form
            // ...
            $("#loginForm").submit();
        },
        url: 'ajax-check-username.php'
    });
});

此外，如果用户按Enter键你想要执行ajax请求，那么也提交，所以这段代码也很方便：

// If they hit the enter button, run the same method
$('#loginForm').bind('keypress', function(e)
{
    if (e.keyCode == 13)
    {
        $(this).find("#btnDoSomething").click();
    }
});

完美无缺！

Answer 6

我知道我正在犯一个旧线程，但我最近遇到了这个问题，并且认为我会为其他任何偶然发现这个问题的人提出答案。我的解决方案是使$.ajax调用同步。

这对我有用：

var formShouldSubmit = false;
$("form#my_form").bind("submit", function(){
     $.ajax({
        url: "my_form_validate.php",
        data: $(this).serialize(),
        success: function(data){
            if ( data.valid ){
                formShouldSubmit = true;
            }
            else{
                $("#error").html('Invalid entry');
            }
        },
        async: false,
        dataType: "json"
    });
    if ( !formShouldSubmit ){
        return false;
    }
});

停止然后在ajax检查后重启submit（）

6 个答案: