Question

（请在通过感谢^ _ ^阅读之前不要将其标记为副本）我想实现用户注册表单。在用户单击“提交”之前，它会调用函数check_username（）来检查用户名是否可用。如果函数返回true，则表单将被提交，否则不会。表格是这样的：

<form action="register/sumbit" method="post" onsubmit="return check_username()">
...
</form>

为了实现check_username函数，我采用了How to return the response from an AJAX call?中提出的方法，但它对我不起作用。也许我误解了它。这是我的功能：

function check_username()
{
  return $.post(url, {data}); //post the input username to sever to see whether it exists. I omitted something for simplicity here
}
check_username().done(
        function(data){
            if(data=="true")//username doesn't exist 
                return true;
            else if(data=="false") 
                            return false;       
            }).fail(function(){});

基本上，我希望check_username返回一个布尔值，值（true或false）将决定是否要提交表单。结果是即使我没有单击“提交”（因此它不应该触发check_username），也会实现“check_username.done（）”。无论用户名是否存在，表单始终都会提交。我想要的是，如果用户名存在，check_username将返回false，以便不提交表单。有谁能告诉我如何解决这个问题？谢谢你的关注！

Answer 1

$ .post不返回布尔值，因此结果（jqXHR对象）将转换为布尔值并为true，因此表单将每次都提交。

更新：由于submit（）方法即使在手动调用时也会触发onsubmit事件，因此您需要存储$ .post中的成功结果并在check_username（）中添加条件。

实现此目标的众多可能方法之一：

<form action="register/sumbit" method="post" onsubmit="return check_username()">
...
</form>

var isUsernameValid = false;

function check_username()
{
    if(isUsernameValid){
        return true;
    }else{
        $.post(url, data, successHandler); 
        return false; 
    }        
}

...

// in your $.post().done() handler...
if(data=="true"){ //username doesn't exist 
     isUsernameValid = true;
     $("form").submit();
}

Answer 2

它永远不会那样工作。您不会从异步操作中获得同步返回。

您可以做的是让check_username()中的处理程序在成功时提交表单。

<form action="register/sumbit" method="post" onsubmit="return check_username(this);">
...
</form>

function check_username(frm)
{
   var myform = $(frm);
   if (myform.data('checked'))  // already checked username? go ahead and submit
     return true;

   // otherwise, start the username check then return false

   // initialize url, data, etc.

   $.post(url, data, 
     function(data) {
       if (data == "true")
       {
         myform.data('checked', true);
         myform.submit();
       }
     }
   );

   return false;
}

关于jquery post方法

2 个答案: