使用javascript和ajax实时验证用户名

时间:2012-07-15 17:11:29

标签: javascript html ajax

我已经为我的注册表单编写了一个脚本,如果在用户名输入字段上有一个keyup事件,那么javascript会检查输入的用户名是否有效,如果是,那么调用ajax函数来检查其可用性。

工作正常。但是可以输入用户名而无需键入,如何处理这些情况?例如。可以通过单击输入字段并选择浏览器建议的名称或使用自动填写填充来输入用户名。在这些情况下没有“密钥”,那么该怎么办呢?

如果我错过了一些案例,请告诉我们。

3 个答案:

答案 0 :(得分:3)

将回调绑定到change事件。

而不是$('username_input').keyup$('username_input').bind('keyup', callback)使用

$('username_input').bind('keyup change blur', function () {
    //
})

<强> [UPDATE]

如果您不使用jQuery,请尝试

function checkUserName() {
   // Ajax validation code
}
userinput = document.getElementById('yourusernameinputid');
userinput.onclick = userinput.onchange = userinput.onblur = checkUserName;

旁注,你应该尝试学习jQuery。它可以为您节省大量时间,并帮助您在更短的时间内创建更好的网站。

[更新2]

看起来似乎没有办法通过自动填充使用事件来检测更改。您需要设置一个计时器,以固定的间隔自动检查您的输入并检查您的最后一个值。

(function() {
   // It is always better to use a closure to prevent the value from 
   // getting overwritten by another piece of code
   var value = '';
   setInterval(2000, function() {
      if (userinput.value != value) {
           checkUserName();
           value = userinput.value;
      }
   });
})();

答案 1 :(得分:0)

  • 在以下情况下测试用户名:
    • 发生模糊事件(当文本字段失去焦点时)和
    • 在用户摘要表单之前,或
    • 发生变化事件(我认为这是最好的)。

答案 2 :(得分:0)