jQuery-验证require_from_group并按名称选择

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery-验证require_from_group并按名称选择相关的知识,希望对你有一定的参考价值。

如jqueryvalidation require_from_group-method示例所示,可以使用类选择组。

$( "#myform" ).validate({
  rules: {
    mobile_phone: {
      require_from_group: [1, ".phone-group"]
    },
    home_phone: {
      require_from_group: [1, ".phone-group"]
    },
    work_phone: {
      require_from_group: [1, ".phone-group"]
    }
  }
});

我还发现可以通过ID进行选择。

$( "#myform" ).validate({
  rules: {
    mobile_phone: {
      require_from_group: [1, "#mobile_phone, #home_phone, #work_phone"]
    },
    home_phone: {
      require_from_group: [1, "#mobile_phone, #home_phone, #work_phone"]
    },
    work_phone: {
      require_from_group: [1, "#mobile_phone, #home_phone, #work_phone"]
    }
  }
});

是否可以按名称选择?以下两次尝试导致错误。

$( "#myform" ).validate({
  rules: {
    mobile_phone: {
      require_from_group: [1, "[name: mobile_phone], [name: home_phone], [name: work_phone]"]
    },
    home_phone: {
      require_from_group: [1, "[name: mobile_phone], [name: home_phone], [name: work_phone]"]
    },
    work_phone: {
      require_from_group: [1, "[name: mobile_phone], [name: home_phone], [name: work_phone]"]
    }
  }
});

$( "#myform" ).validate({
  rules: {
    mobile_phone: {
      require_from_group: [1, "[name: 'mobile_phone'], [name: 'home_phone'], [name: 'work_phone']"]
    },
    home_phone: {
      require_from_group: [1, "[name: 'mobile_phone'], [name: 'home_phone'], [name: 'work_phone']"]
    },
    work_phone: {
      require_from_group: [1, "[name: 'mobile_phone'], [name: 'home_phone'], [name: 'work_phone']"]
    }
  }
});
答案

具有attrib的选择器与=一起工作而不是点:所以你应该只用:替换=

见下面的片段:

$(document).ready(function () {
    $("#form").validate({
        rules: {
            "mobile_phone": {
                require_from_group: [1, "[name= mobile_phone], [name=home_phone], [name=work_phone]"]
            },
            "home_phone": {
                require_from_group: [1, "[name=mobile_phone], [name=home_phone], [name=work_phone]"]
            },
            "work_phone": {
                require_from_group: [1, "[name=mobile_phone], [name=home_phone], [name=work_phone]"]
            }
        },submitHandler: function (form) { // for demo
            if($(form).valid() ) alert("form valide");
            return false;  //form.submit();
        }
    });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/additional-methods.js"></script>

<form id="form" method="post" action="#">


    <label for="name">mobile phone :</label>
    <input class="phone-group" type="text" name="mobile_phone" id="mobile_phone" /><br><br>
    
    
    <label for="name">home phone :</label>
    <input class="phone-group" type="text" name="home_phone" id="home_phone" /><br><br>
    
    
    <label for="name">work phone :</label>
    <input class="phone-group" type="text" name="work_phone" id="work_phone" /><br><br>
    <button type="submit">Submit</button>
</form>

以上是关于jQuery-验证require_from_group并按名称选择的主要内容,如果未能解决你的问题,请参考以下文章

jquery的表单验证插件怎么验证身份证号

jquery 验证数值大小

jquery验证表单是不是为空

Jquery 验证不能正确验证数字?

jQuery 验证——不验证

jQuery基础学习06 jQuery表单验证插件-Validation