验证复选框输入必须仅由 jquery 检查一个

Posted

技术标签:

【中文标题】验证复选框输入必须仅由 jquery 检查一个【英文标题】:validate checkbox input must be checked one only by jquery 【发布时间】:2017-02-26 05:14:46 【问题描述】:

我有一个带有复选框的表单,并通过 jquery 提交方法,如下所示:

$("form.adj_baru").submit(function (event) 
                event.preventDefault();
                if (confirm('Anda yakin akan submit ?')) 
                    var formData = new FormData($(this)[0]);
                    var cekbox = $("input[name=size]").val();
                    if (cekbox === "") 
                        alert("Pilih salah satu ukuran !");
                        return;
                    
                    $.ajax(
                        url: 'adj/adj_crud.php', //type='add_adj'
                        type: 'POST',
                        data: formData,
                        async: false,
                        cache: false,
                        contentType: false,
                        processData: false,
                        success: function (data) 
                            console.log(data);
                            
                    );
                
                return false;
            );
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class='adj_baru'>
  <label>Checkbox : </label><br>
  <input type='checkbox' name='size' value='m'>M<br>
  <input type='checkbox' name='size' value='l'>L<br>
  <input type='checkbox' name='size' value='xl'>XL<br>
  <input type='submit' value='SUBMIT'>
  </form>
  </body>

当复选框为空时,警报alert("Pilih salah satu ukuran !") 不起作用。如果复选框未选中 either 并且选中 no more than one

,如何发出警报

【问题讨论】:

【参考方案1】:

您可以使用 .length 计算选中的复选框。见sn-p。然后您可以决定,如果选中了一定数量的复选框(或者没有选中),该怎么办。

$("form.adj_baru").submit(function (event) 
                event.preventDefault();
                var checked = $("input[name=size]:checked").length;
                if (checked === 1) 
                  alert("1 checked");
                 else if (checked > 1) 
                  alert("More than 1 checked");
                 else 
                  alert("None checked");
                
                return false;
            );
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class='adj_baru'>
  <label>Checkbox : </label><br>
  <input type='checkbox' name='size' value='m'>M<br>
  <input type='checkbox' name='size' value='l'>L<br>
  <input type='checkbox' name='size' value='xl'>XL<br>
  <input type='submit' value='SUBMIT'>
  </form>
  </body>

【讨论】:

【参考方案2】:

也许你更新了下面的部分。检查是否有复选框被选中。

                var cekbox = $("input[name=size]:checked").length;
                if (cekbox == 0) 
                    alert("Pilih salah satu ukuran !");
                    return;
                

【讨论】:

【参考方案3】:

这是另一种检查复选框是否选中的方法:

                var cekbox = $("input:checked").length;
                if (cekbox == 0) 
                    alert("Pilih salah satu ukuran !");
                    return;
                 

【讨论】:

【参考方案4】:

试试这个代码

 if ($("input:checked[name=size]").length != 1) 
      alert("Pilih salah satu ukuran !");
      return;
 

这里是演示https://jsfiddle.net/8wzcyoe5/

【讨论】:

以上是关于验证复选框输入必须仅由 jquery 检查一个的主要内容,如果未能解决你的问题,请参考以下文章

我的 JQuery 验证插件在复选框输入时表现异常

如果选中某些复选框,则 jquery 验证表单输入

如何使用表单验证 jquery 检查至少一个选中的复选框?

jquery验证检查3个复选框的状态都被选中然后启用按钮

使用 jQuery 验证复选框和输入文本值

复选框的 JQuery 验证