Question

我对javascript检查有疑问。

我有以下表格

<form name='form' id='form' method='post' action='next.php'>

<input type='text' class='red'  />
<input type='text' class='red'  />
<input type='text' class='red'  />
<input type='text' class='blue' />
<input type='text' class='blue' />
<input type='submit' value='Next' />

</form>

我想要完成的是，只有填写了“red”类的其中一个字段时，才能提交表单。因此，如果用户只填写一个或多个类“蓝色”字段，他们会收到一个警告，他们需要至少放入一个类“红色”字段。

Answer 1

您可以连接到表单的提交事件，并在迭代所有字段中使用类red和tehn返回结果。如果提交事件返回false，则表单不会被提交

$("#form").submit(function(){
   var exist = false;
   $(this).find("input.red").each(function(){
          exist = exist || this.value;
   });
   return exist;
})

这假设应将所有空白值视为填充字段。如果不是，则需要.trim()值。

当存在设置为true时，可以使版本提前退出但是对于少量元素来说，它不太可能显着更快

Answer 2

$("#submit").click(function() {
    var exist ;

    $("#formId input[type=text]").each(function() {
        if($(this).hasClass('red')) 
         if($(this).val() != "") 
            exist = true;             
    });

    if(exist == true) {
        // red class exist
    } else {
        alert("No Red Class");
        return false;
    }
});

Answer 3

这是你想要实现的目标吗？

  var failed = false;
  $(".red").each(function(i, elem){
     if($(elem).val() == ""){
        failed = true;
        return false;
     }
  });

  if (failed){
  //don't proceed
  }

如果其中一个类red的输入为空字符串

，则不会继续

Answer 4

您似乎想要检查是否填写了至少一个.red输入：

$("#form").submit(function() {
    if($(this).find('.red').filter(function(){return $.trim(this.value) != ""}).length === 0)
       return false;        
});

Answer 5

试试这个

$('input[type=submit]').on('click', function (e) {
    e.preventDefault();
    var check = $('.red').filter(function() {
        return this.value != ''
    }).length;

    if(check < 1){
     alert('Fill out red class input')   
    }
});

<强> Check Fiddle

Answer 6

尝试

$('#form').submit(function(){
    var valid = $(this).find('input.red').filter(function(){
        return $.trim(this.value) != '';
    }).length > 0;
    if(!valid){
        alert('fill red');
        return false;
    }

});

演示：Fiddle

Answer 7

对于您的用例，请使用以下内容：

$("#form").submit(function () {
    if ($(this).find('.red').filter(function () {
                return $.trim(this.value) != ""
            }).length === 0)
        return false;
});

检查类是否填充jQuery

7 个答案: