Question

我有三个具有相同类名的文本框，并尝试使用jquery进行一些自定义验证。使用以下代码，它会显示正确的元素，并在验证失败时应用CSS效果。当涉及removeclass方法时，每次从最后一个元素中删除类而不管focus / clicked元素。

    txtbox=$(".mintxt");

    txtbox.each(function(){
        txt=$(this);         
        if(txt.val().length<5){
            txt.addClass("er");
            txt.focus(function(){txt.removeClass("er");});
            //noerr=false;
        } 
    });

=============================================== ========================

最终工作版

Working Demo

Answer 1

问题在于scope，使用this元素而不是在事件处理程序之外获取的元素，

txtbox = $(".mintxt");
txtbox.each(function () {
    txt = $(this);
    if (txt.val().length < 5) {
        txt.addClass("er");
        txt.focus(function () {
            $(this).removeClass("er");
        });
    }
});

DEMO

Answer 2

为了使用Jquery验证字段，它们必须包含在<form>中。如果是，请使用jQuery Validation验证所需的字段，然后应用任何自定义css。

jquery将任务分配给匿名函数中的事件

2 个答案:

DEMO