如果使用 jquery 其中一个字段为空而另一个字段不为空，则无法获得验证

Question

尝试对表单进行验证，如果一个已填写，另一个为空，那么应该得到 validation.If 两个字段都是空的，那么不应该得到任何 validation.If 一个是用文本填充的另一个是空的，那么应该 validation.I 已尝试使用代码，但它不起作用。

<form action="#" method="post" id="myform" role="form" enctype="multipart/form-data">
    <div class="col-md-8">
        <label for="name"><b>Name</b><span class="mandatory">
                <font color="red">*</font>
            </span></label>
        <input type="text" placeholder="Enter Your Name" name="uname" id="uname" class="mygroup">
    </div>
    <div class="col-md-8">
        <label for="email"><b>Email</b><span class="mandatory">
                <font color="red">*</font>
            </span></label>
        <input type="text" placeholder="Enter Email" name="email" id="email" class="mygroup">
    </div>
    <div class="clearfix">
        <button id="submit" name="submit_contact" type="submit" class="signupbtn">Submit</button>
    </div>
</form>


$(document).ready(function() {

$('#myform').validate({
    rules: {
        email: {
            required: function(element) {
                return $('#uname').is(':filled');
            }
        }
    }
});

 });

fiddle link: https://jsfiddle.net/actqp9y3/

Answer 1

如果我没理解错的话

$(document).ready(function() {
    $('#myform').validate({
     rules:{
      'email':{
       required:function(){
        return $('#uname').val().length > 0;
       }
      },
      'uname':{
       required:function(){
          return $('#email').val().length > 0;

       }
      }
     }
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.0/dist/jquery.validate.js"></script>
<form action="#" method="post"  id="myform" role="form" enctype="multipart/form-data"> 
     <div class="col-md-8">
      <label for="name"><b>Name</b><span class="mandatory"><font color="red">*</font></span></label>
      <input type="text" placeholder="Enter Your Name" name="uname" id="uname" class="mygroup">
     </div>
     <div class="col-md-8">
      <label for="email"><b>Email</b><span class="mandatory"><font color="red">*</font></span></label>
      <input type="text" placeholder="Enter Email" name="email"  id="email" class="mygroup">
     </div>
     <div class="clearfix">
       <button  id="submit" name="submit_contact" type="submit" class="signupbtn">Submit</button>         
     </div>
</form>

Answer 2

<form action="#" method="post"  id="myform" role="form" enctype="multipart/form-data">  
                <div class="col-md-8">
                    <label for="name"><b>Name</b><span class="mandatory"><font color="red">*</font></span></label>
                    <input type="text" placeholder="Enter Your Name" name="uname" id="uname" class="mygroup">
                </div>
                <div class="col-md-8">
                    <label for="email"><b>Email</b><span class="mandatory"><font color="red">*</font></span></label>
                    <input type="text" placeholder="Enter Email" name="email"  id="email" class="mygroup">
                </div>
                <div class="clearfix">
                  <button  id="submit" name="submit_contact" type="submit" class="signupbtn">Submit</button>         
                </div>
            </form>

JS:

$(document).ready(function() {
$('#myform').validate({
    rules: {
        email: {
            required: function(element) {
                return $('#uname').is(':filled');
            }

        },
        uname: {
            required: function(element) {
                return $('#email').is(':filled');
            }       
        }              
    }      
});
});

Fiddle Link: https://jsfiddle.net/rnmejfLy/

如果使用 jquery 其中一个字段为空而另一个字段不为空，则无法获得验证

unable to get validation if one of the field is empty and other is not empty using jquery

jquery

jquery-validate