如何使用jquery在按钮单击时验证多个文本框

时间:2017-01-11 11:59:32

标签: javascript jquery validation

在我的应用程序中,我有五个文本框。

当提交按钮时,我想验证这些文本框。

验证应该至少有3个文本框应该有值。

老方法是使用jQuery我们可以检查每个循环但是还有其他方法吗?

$("#submitBtn").on("click", function(){
  var count = 0;
  $(".textboxesDiv input").each(function () {
    if($(this).val() != "" && $(this).val() != null && $(this).val() != undefined){
      count++;
    }
  });
  if(count > 2 )
  {
    alert("3 or more");
  }
  else{
    alert("lessa than 3");
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="textboxesDiv">
  <input type="text" id="textbox1" >
  <input type="text" id="textbox2" >
  <input type="text" id="textbox3" >
  <input type="text" id="textbox4" >
  <input type="text" id="textbox5" >
</div>
<input type="submit" id ="submitBtn" name="button"/>

https://jsfiddle.net/7Lmgbbng/1/

1 个答案:

答案 0 :(得分:1)

检查此示例 http://jsfiddle.net/ggChris/mfbaxkfp/

<input id="AccountText" type="text" name="AccountText" value="" class="form-control" placeholder="Name" required=''/>
<input class="button" type="submit" value="submit">


$(document).ready(function(){
       $('.button').click(function(){
            if ($('input#AccountText').val() == ""){
                alert('Please complete the field');
            }
        });
    });

或者您可以使用jquery验证  https://jqueryvalidation.org/