Question

我希望要求选择一组复选框中的3个复选框。

我已经能够将选择限制为不超过3，这很好，但我还需要至少选择3个组。

这是我的HTML示例：

      <div class="pricing-levels-3">
      <p><strong>Which levels would you like? (Select 3 Levels)</strong></p>
      <input class="single-checkbox" type="checkbox" name="vehicle1" value="Bike1">Level 1<br>
      <input class="single-checkbox" type="checkbox" name="vehicle2" value="Bike2">Level 2<br>
      <input class="single-checkbox" type="checkbox" name="vehicle3" value="Bike3">Level 3<br>
      <input class="single-checkbox" type="checkbox" name="vehicle4" value="Bike4">Level 4<br>
      <input class="single-checkbox" type="checkbox" name="vehicle5" value="Bike5">Level 5<br>
      <input class="single-checkbox" type="checkbox" name="vehicle6" value="Bike6">Level 6<br>
      <input class="single-checkbox" type="checkbox" name="vehicle7" value="Bike7">Level 7<br>
      </div>

和jQuery：

    var limit = 3;
$('input.single-checkbox').on('change', function(evt) {
   if($(this).siblings(':checked').length >= limit) {
       this.checked = false;
   }
});

有什么想法吗？

Answer 1

试试这个：

 var len = $(".single-checkbox:checked").length; // get length (amount)

然后你可以检查是否选中了三个复选框。

if (len == 3)

Answer 2

var limit = 3, checked = 0;

$('input.single-checkbox').on('change', function(event) {

    checked = $('input.single-checkbox:checked').length;

    if(checked >= limit) {
        this.checked = false; // OR event.preventDefault();
    }
});

$('form').on('submit',function(e){
    if( checked < limit )
    {
        e.preventDefault();
        // alert('...');
    }
});

需要选择一系列复选框

2 个答案: