Question

我已经编写了这段代码，它只是找到了，但我觉得我在这里非常愚蠢，我可以缩短这段代码。反正有没有缩短这个？请留下答案，谢谢。

$('.submit-form').on('click' , function() {

 if($('.form-signup1').val().length === 0) {
   $('.form-signup1').addClass('error')
 }

 if($('.form-signup2').val().length === 0) {
   $('.form-signup2').addClass('error')
 }

 if($('.form-signup3').val().length === 0) {
   $('.form-signup3').addClass('error')
 }

 if($('.form-signup4').val().length === 0) {
   $('.form-signup4').addClass('error')
 }

 if($('.form-signup5').val().length === 0) {
   $('.form-signup5').addClass('error')
 }

 if($('.form-signup6').val().length === 0) {
   $('.form-signup6').addClass('error')
 }

});

编辑：非常感谢你的回答，我非常感谢你的时间。我选择了最能理解的那个。再次感谢！

Answer 1

为所有元素添加一个公共类，然后

$('.submit-form').on('click', function () {
    $('.form-signup').each(function () {
        var $this = $(this);

        if ($this.val().length === 0) {
            $this.addClass('error');
        }
    })

});

Answer 2

如果您无法在元素中添加新类，请使用此

for (var i = 1; i < 7; i++) {
    var $this = $('.form-signup' + i);
    if ($this.val().length === 0) {
        $this.addClass('error');
    }
}

Answer 3

    $('.submit-form').on('click', function (event) {
        event.preventDefault();
        var error=0;
        $('input[type=text]').each(function () {
            var $this = $(this);
            error++;
            if ($this.val().length === 0) {
                $this.addClass('error');
            }
        });
   if(error==0)
   $("form")[0].submit();

    });

以上代码将阻止在发生错误时提交。

Answer 4

如果要验证每个输入的值，可以像

那样进行验证

 $('input[type=text]').each(function () {
        if ($(this).val().length === 0) {
            $this.addClass('error');
        }
    })

缩短表单验证jQuery代码

4 个答案: