2

我有一个带有字段元素的表单，其中包含 required、class1、class2、class3 等类。现在我需要遍历所有元素并在上述任何类不满足时显示错误消息。我已经为需要编写了以下 jquery。现在我也需要级联其他类。有人可以指导我吗？

<input class="required allowalphanum allownospace" type="text" id="first_name" name="first_name" title="First name is required or the data entered was invalid" value=""/>
<input class="required allowalphanum allownospace" type="password" id="password" name="password" title="Password is required or the data entered was invalid" value=""/>
<input class="required confmpasswrd" type="password" id="cnfmPassword" name="cnfmPassword" title="Password needs to match the above field" value=""/>

jQuery fn

$('#submit_form .required').filter(':visible').each(function () {
var input = $(this);
input.next('ul.errormessages').remove();
input.removeClass('highlight');
if (!input.val()) {
    input.addClass('highlight');
    var msg = $(this).attr('title');
    input.after('<ul class="errormessages"><li>'+msg+'</li></ul>');
    returnVal = false;
}
});

现在我需要首先检查是否满足所需的类。然后我还需要检查其他类是否允许字母数字、allownospace、cnfmPassword 等。

有人可以指导我吗？

4

2 回答 2

0

有了这个，您可以检查 elem 是否有 yourClass：

if ($('elem').hasClass('yourClass')) {
    // do stuff
}

使用 $.each，您可以传入当前索引和元素：

$('selector').each(function(i, e){
    if ($(e).hasClass('yourClass')) {   // e becomes each elem in the $('selector') object
        // do stuff with $(e)
    }
})

您可以检查多个类：

$('selector').each(function(i, e){
    if ($(e).hasClass('yourClass') && $(e).hasClass('yourOtherClass') && $(e).hasClass('yourStuffOverHere')) {
        // do stuff
    }
})
于 2013-10-21T06:05:56.187 回答
0

类似于 jQuery 的验证器插件的解决方案：

// List of validating functions for each class
var validators = {
    allowalphanum: function(val) {
        return /^[a-z0-9]+$/i.test(val);
    },
    allownospace: function(val) {
        return !/\s/.test(val);
    }
};

$('#submit_form .required').filter(':visible').each(function () {
    var input = $(this);
    input.next('ul.errormessages').remove();
    input.removeClass('highlight');
    if (!input.val()) {
        input.addClass('highlight');
        var msg = $(this).attr('title');
        input.after('<ul class="errormessages"><li>'+msg+'</li></ul>');
        returnVal = false;
    }

    // Get all the classes of the current input
    if(this.className) {
        var classes = this.className.split(/\s+/);
        for(var p in classes) {
            if(classes[p] in validators) {
                returnVal = returnVal & validators[classes[p]] (input.val());
            }
        }
    }

});

编辑：添加了检查是否定义了 className

于 2013-10-21T06:33:34.707 回答