使用AJAX进行表单验证

我正在创建一个包含3个输入字段（用户名，密码和密码登录）的登录表单。使用AJAX进行表单验证

Looks something like this:

正如你所看到的，我使用AJAX在客户端验证直接登录。

var username = document.getElementById("username").getElementsByTagName("input")[0]; 
username.onfocus = function(){ 
    this.className = "thinking"; 
} 
username.onblur = validateUsername;

以及类似的密码。提交按钮在默认情况下处于禁用状态，并且只有在两个字段都被验证后才能启用。

这是我的问题：输入用户名并点击[Tab]按钮后，我的PHP脚本会验证用户名并显示绿色标记，如图所示。但是当我输入密码时，用户将不得不手动点击其他地方来触发'onblur'事件并执行密码验证，这不是非常直观和吸引人的。密码检查应该在焦点仍然在密码字段上时完成，这意味着当用户开始输入密码时，应该触发一个事件，并且当他完成键入时，应该触发另一个事件。我应该怎么做呢？

谢谢！

来源

2015-06-03 Suyash Shetty

答案就在于这个问题。我也用它http://stackoverflow.com/questions/14042193/how-to-trigger-an-event-in-input-text-after-i-stop-typing-writing –

如何使用'onkeydown'与一个小延迟？ –

'onkeyup'更好。 –

您正在使用的onblur事件，这意味着，只有当现场将留下不聚焦，当你按下[Tab]键正在发生的事情就会被触发。为了在密码字段上触发onBlur事件，您必须再次按[Tab]键。您还可以使用具有默认验证的HTML5 input tags。如果你想在用户输入时触发一个事件，那么你可以使用keyup和keydown事件。如果您想在用户开始输入时专门触发一个事件，而当他完成一个事件时，您必须假定他需要一些时间进行输入。看看example。

来源

2015-06-03 07:31:28 Tarun

谢谢！这工作。 –

使用AJAX进行表单验证

回答

相关问题