如果选中复选框条件，则Jquery验证？

Question

我有一个表单，如果选中复选框，我将允许用户更改其密码，否则不允许用户更改其密码。

我该怎么办？

$(function() {

  var passworderror = "Password should be alphanumeric, 1 uppercase, 1 lowercase and 6 to 20 characters long.";


  $.validator.addMethod("pwcheckspechars", function(value) {
    return /[!@#$£%^&*()_=\[\]{};':"\\|,.<>\/?+-]/.test(value)
  }, passworderror);

  $.validator.addMethod("pwchecklowercase", function(value) {
    return /[a-z]/.test(value) // has a lowercase letter
  }, passworderror);
  $.validator.addMethod("pwcheckuppercase", function(value) {
    return /[A-Z]/.test(value) // has an uppercase letter
  }, passworderror);
  $.validator.addMethod("pwchecknumber", function(value) {
    return /\d/.test(value) // has a digit
  }, passworderror);


  $('.myform').validate({
    rules: {
      changepsw: {
        required: true
      },
      newpassword: {
        required: true
      }
    }

  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post" class="myform">
  <input type="checkbox" id="changepsw" name="changepsw">
  <br/>
  <label for="newpassword">New Password</label>
  <input type="text" name="newpassword" id="newpassword">
  <br/>
  <input type="submit" value="submit">
</form>

Answer 1

试试这个方法

$(function(){

var passworderror = "Password should be alphanumeric, 1 uppercase, 1 lowercase and 6 to 20 characters long.";


            $.validator.addMethod("pwcheckspechars", function (value) {
             if($("#changepsw").is(':checked')){  
                return /[!@#$£%^&*()_=\[\]{};':"\\|,.<>\/?+-]/.test(value)
              }else{
                return true;
              }
            }, passworderror);

            $.validator.addMethod("pwchecklowercase", function (value) {
                 if($("#changepsw").is(':checked')){
                   return /[a-z]/.test(value)
                 }else{
                  return true;
                 }
            }, passworderror);
            $.validator.addMethod("pwcheckuppercase", function (value) {
                 if($("#changepsw").is(':checked')){
                return /[A-Z]/.test(value) // has an uppercase letter
              }else{
                return true;
              }
            }, passworderror);
            $.validator.addMethod("pwchecknumber", function (value) {
            if($("#changepsw").is(':checked')){
                return /\d/.test(value) // has a digit
              }else{
                return true;
              }

            }, passworderror);


  $('.myform').validate({
      rules:{
        changepsw: {
          required:true
        },
        newpassword:{
             required:function(){
              return "#changepsw:checked"
             },
            pwcheckspechars :true,
            pwchecklowercase:true,
            pwcheckuppercase:true,
            pwchecknumber:true

        }
      }

    });
})

Answer 2

单击复选框时，您可以尝试启用/禁用表单。然后选中，启用验证。

＆＃13;

＆＃13;

var passworderror = "Password should be alphanumeric, 1 uppercase, 1 lowercase and 6 to 20 characters long.";

$.validator.addMethod("pwcheckspechars", function (value) {
  return /[!@#$£%^&*()_=\[\]{};':"\\|,.<>\/?+-]/.test(value)
}, passworderror);

$.validator.addMethod("pwchecklowercase", function (value) {
   return /[a-z]/.test(value) // has a lowercase letter
}, passworderror);

$.validator.addMethod("pwcheckuppercase", function (value) {
  return /[A-Z]/.test(value) // has an uppercase letter
}, passworderror);

$.validator.addMethod("pwchecknumber", function (value) {
  return /\d/.test(value) // has a digit
}, passworderror);

var validator = $('.myform').validate();

$('#changepsw').click(function() {
  if($(this).is(':checked')) {
    $('#newpassword').attr('disabled', false).rules('add', {
      required: true,
      pwcheckspechars: true,
      pwchecklowercase: true,
      pwcheckuppercase: true,
      pwchecknumber: true
     
    });
    $('input[type="submit"]').attr('disabled', false);
  } else {
    validator.resetForm()
    $('#newpassword').attr('disabled', true).rules('remove');
    $('input[type="submit"]').attr('disabled', true);
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.min.js"></script>
<form action="" method="post" class="myform">
    <input type="checkbox" id="changepsw" name="changepsw">
    <br/>
    <label for="newpassword">New Password</label>
    <input type="text" name="newpassword"  id="newpassword" disabled>
    <br/>
    <input type="submit" value="submit" disabled>
  </form>

＆＃13;

＆＃13;

＆＃13;