jquery - 验证具有相同类名的两个输入

Question

我需要验证两个文本字段的空值，在我的页面中尝试了这段 Jquery，

    $('#div1').hide();

    $('#btn1').click(function(){

    $('.class1').each (function() {

        if($(this).val() == "") {

        $('#div1').show();
        }else {
        $('#div1').hide();
        }
    });  

它仅验证第一个文本字段。有什么帮助吗？

Answer 1

实际上，只要选择中的任何元素具有val()of ，您的代码就应该显示 #div1 ""。我不确定这是否是您想要的，也许您想<div>为每个输入元素显示不同的内容？

每个函数的回调将获取两个参数，-index数组中元素的索引，以及element，数组中的元素。您可以使用它来区分您正在验证的元素：

$('.class1').each (function(index, element) {
    if($(this).val() == "") {
        $('#div' + index).show();
    }else {
        $('#div' + index).hide();
    }
});  

有关演示，请参阅我的 jsfiddle。

不过，这确实是不干净的编程。您可能想尝试使用出色的JQuery 验证插件。

Answer 2

我认为您应该遵循以下方法

$('#div1').hide();
    $('#btn1').click(function() {
        $('.class1').each(function() {
            $('#div1').hide();
            if ($(this).val() == "") {
                $('#div1').show();
                return false;
            }
        });
    });

根据您的代码验证，我猜只对最后一个输入进行了验证。

工作演示