ajax调用不等待

问题描述：

我有一个表单，当我的用户点击“提交”时，我首先要检查他们选择的用户名是否已被使用。我用ajax这个：ajax调用不等待

function submit() { 
    if (userNameTaken()) { 
     alert("Please choose a username that is not already in use."); 
     return false; 
    } 
} 

function userNameTaken() { 
    var taken = false; 
    var username = $("#username").val(); 
    $.get("username_used.cgi", { "username": username }, function(data) { 
     taken = data > 0; 
    }); 
    return taken; 
}

所以我知道这是采取了用户名时，该功能userNameTaken()并返回true。

不管怎样，表单几乎可以保存，就好像javascript不会暂停并等待这个ajax调用完成，而是继续继续并评估。有关如何解决这个问题的任何想法，以便我的表单将等待这个Ajax调用，而不是提交？

答

因为Ajax在正常的自顶向下过程中不会执行。提交不会等待Ajax响应。您可以使用normal button而不是submit button，以便您可以手动提交表单。

<form ... > 
// other parts 

<input type="button" value="sumbit" onclick="userNameTaken();"/> 
</form>

变化的代码

所以它会检查Ajax响应比提交表单，如果不采取其他的USENAME示警戒。你可以把一些id到按钮和窗体来处理它很容易使用jquery ..

如果用户只是输入任何输入字段，表单将很高兴地提交绕过验证。 – 2012-01-01 03:20:54

您应该意识到，除IE以外的任何浏览器中，无需提交按钮即可提交作品。尝试一下http://jsfiddle.net/liho1eye/cdwqs/。答案是相关的，但严重缺陷。永远不要将提交操作挂在按钮上。请参阅关于您发布的链接中明显和危险错误答案的部分。 – 2012-01-01 07:37:55

：P谢谢你，但是这个事件可以通过使用keyup和preventDefault轻松避免。此外，没关系，因为你可以看到答案对OP是正确的和有帮助的。 – 2012-01-01 08:45:26

答

您不能像这样从Ajax调用中返回数据：Ajax调用在任意未来时间返回，而userNameTaken()的调用在Ajax请求完成之前立即返回（实质上）立即返回。

您可能会使呼叫同步，从而有可能导致浏览器UI停滞。国际海事组织这不是首选。

或者，只允许提交该名称是否未使用：使用回调函数来设置一个“OK”标志，或启用提交按钮，或弹出警报，还是......

FWIW，我查找弹出式快讯提交非常容易破坏性和反向平顺的用户体验。

答

您需要将Ajax调用的“异步”设置设置为“false”。这将强制该函数阻塞，直到调用返回。

以下是JQuery文档的链接。检查“异步”设置： http://api.jquery.com/jQuery.ajax/

@srchulo - 你应该知道，如果你设置'async：false'，浏览器将冻结的Ajax调用的持续时间，并没有反应。这不是建议的做法。推荐的做法是更改您的代码以仅在成功处理程序中处理ajax调用的结果。这需要重新考虑代码流的工作方式，但如果做得对，则可以提供更好的用户体验。 – jfriend00 2012-01-01 03:51:12

我试图只有这样的事情..但有人不喜欢和下来投票。我觉得可以这样做，请看看我的答案并给出你的看法。 – 2012-01-01 04:40:35

ajax调用不等待

相关推荐