键入jquery时进行验证

时间:2012-08-07 21:03:11

标签: jquery validation function

我有这个jQuery代码,用于在用户输入时验证电子邮件输入:

$('#email').keyup(function() {
    if (!isValidEmailAddress(email)) {
        $('#validate').removeClass();
    } else {
        $('#validate').removeClass();
        $('#validate').addClass('validate');
    }
});​

但是,如果用户输入例如“Da”,浏览器会识别该电子邮件,并在下拉列表中显示选项以完成它,例如“daniel@gmail.com”,那么我可以在jQuery中使用哪个事件代码甚至在用户点击该下拉选项或点击输入以选择它时验证它......

提前致谢

3 个答案:

答案 0 :(得分:2)

如果您使用jquery 1.7+ bind keyup并使用相同的方法更改事件:

$("#email").on("change keyup", function() {
    $('#validate').toggleClass('validate', isValidEmailAddress(this.value));
});

你可以缩短你的代码,如果电子邮件有效,你只想添加css类'validate'(我认为#email是一个输入表单,你想验证它的值)。

请记住,jQuery对象会返回您查找过的集合,因此将$('validate')保存到变量并使用该变量而不是让jquery一遍又一遍地找到该元素(在您的变量中最多可以找到几次)码)。

如果您使用旧版本的jQuery,只需更改为bind

答案 1 :(得分:1)

也许这个插件可以帮助您满足您的需求,然后将其与您已有的代码集成。

看一下这个演示:

http://www.zurb.com/playground/jquery-text-change-custom-event

希望这会有所帮助: - )

答案 2 :(得分:0)

使用密钥和更改:

$("#email").change(validate).keyup(validate);;

function validate()
{
if (!isValidEmailAddress(email)) {
        $('#validate').removeClass();
    } else {
        $('#validate').removeClass();
        $('#validate').addClass('validate');
    } 
}

示例小提琴:http://jsfiddle.net/johnkoer/Z8Z7b/7/