Question

问题是在登录页面上，在提交了错误的条目后，ajax请求在按下提交时不再进行第二次。

我已经通过StackExchange搜索了我的问题的答案，并查看了其他十几个链接，例如Why won't my jQuery form resubmit?和jQuery & AJAX login form。看起来我需要取消绑定提交的变量，但不知道如何执行此操作。

HTML

<div data-role="page" id="login">
  <div data-role="header" data-position="inline" data-theme="b">    
    <h1>My login</h1>
  </div><!-- /header -->
  <div data-role="content">
    <form method="post" id="loginform">
        <label for="username">Username:</label> <input type="text" name="username" id="username" value=""  />
        <label for="passwd">Password:</label> <input type="password" name="passwd" id="passwd" value=""  />
        <input type="submit" value="Login" />
    </form>
  </div><!-- /content -->
</div><!-- /login page -->

的JavaScript ：

$(document).ready(function() { 
  $("#loginform").on('submit',function(event){
    var $form = $(this),
      serializedData = $form.serialize();

    // fire off the request to /form.py
    $.ajax({
      url: "https://mywebsite/cgi-bin/form.py",
      type: "post",
      data: serializedData,

      // callback handler that will be called on success
      success: function(response, textStatus, jqXHR){
        console.log(response);
        // If login is unsuccessful, log message and return to login screen again
        if (response == "INVALID_USER\n") {
          alert("sorry, try again");
        } else {
          // Login successful - do something
        }
      },

      // callback handler that will be called on error
      error: function(jqXHR, textStatus, errorThrown){
        console.log(
          "The following error occured: "+
            textStatus, errorThrown);
      },

      // callback handler that will be called on completion
      // which means, either on success or error
      complete: function(){
        //----- DO I NEED TO UNBIND SOMETHING HERE?
        var dummy = 1;
      }
    }); // end of ajax call
}); // end of submit handler
});

Answer 1

您是否会尝试在事件处理程序结束之前添加return false？使用return false可以防止事件触发并阻止用户继续操作而不填写正确的必填字段。

$("#loginform").on('submit',function(event){

    ...

    return false;
});

此外，服务器返回什么数据类型？例如，如果服务器返回JSON，那么您应该在AJAX代码中添加dataType: 'json'。如果没有指定，jQuery将尝试根据响应的MIME类型推断它。

也许您可以使用firebug来确定是否发生任何错误。

使用jquery的登录页面不会重新提交

1 个答案: