验证 .validate() 规则 jquery 函数上所需的单选按钮

Posted 2023-05-09

【中文标题】验证 .validate() 规则 jquery 函数上所需的单选按钮

【英文标题】：Validate required radiobutton on .validate() rules jquery function

【发布时间】：2021-08-15 10:26:54

【问题描述】：

我的表单上有单选按钮，我不需要验证它，但我不知道如何根据规则验证它。不勾选会显示错误字段 谢谢

$("[name='formName']").validate(
        rules: 
            radName: 
        
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>

 <form name="formName" method="post" action="#">
    <div>
      <input type="radio" name="radNamae" value="1">
      <label for="rdb-illustration">Label 1</label>
      <input type="radio" name="radNamae" value="2">
      <label for="rdb-illustration">Label 2</label>
      <input type="radio" name="radNamae" value="3">
      <label for="rdb-illustration">Label 3</label>
    </div>
    <input type="submit" id="btn-submit" class="btn-gen" value="Submit">
 </form>

【参考方案1】：

$("[name='formName']").validate(
  rules: 
    radName: 
      required: true
    
  ,
    errorPlacement: function (error, element) 
    var name    = $(element).attr("name");
    var obj    = $("#" + name + "_validate");
        error.appendTo(obj);
    
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>

<form name="formName" method="post" action="#">
  <div>
    <input type="radio" name="radName" value="1">
    <label for="rdb-illustration">Label 1</label>
    <input type="radio" name="radName" value="2">
    <label for="rdb-illustration">Label 2</label>
    <input type="radio" name="radName" value="3">
    <label for="rdb-illustration">Label 3</label>
  </div>
   <div id='radName_validate'></div>
  <input type="submit" id="btn-submit" class="btn-gen" value="Submit">
</form>

【讨论】：

如何将错误字段放在最后一个rad按钮之后或div之后？

您可以使用errorPlacement 进行设置。答案已更新

这太棒了。谢谢你。但是我怎样才能使 errorPlacement 仅对 radName 专有。抱歉，只是 jquery 验证的新手。我所有的错误放置都很好，但是如果您尝试添加另一个输入并进行验证。所有其他错误字段都转到特定的 div

我更新了我的答案。这将允许您为特定的表单错误创建特定的 div。