我有以下HTML： <div class="pricing-levels-3"> <p><strong>Which level would you like? (Select 3 Levels)</strong></p> <input class="single-checkbox"type="checkbox" name="vehicle" value="Bike">Level 1<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 2<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 3<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 4<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 5<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 6<br> <input class="single-checkbox" type="checkbox" name="vehicle" value="Bike">Level 7<br> </div>直播網站：http://www.chineselearnonline.com/amember/signup20.php我該怎么做，以便用戶只能選擇其中三個復選框？
3 回答
慕尼黑5688855
TA貢獻1848條經驗 獲得超2個贊
使用change事件，您可以執行以下操作：
var limit = 3;
$('input.single-checkbox').on('change', function(evt) {
if($(this).siblings(':checked').length >= limit) {
this.checked = false;
}
});
楊魅力
TA貢獻1811條經驗 獲得超6個贊
嘗試這樣。
在變更事件中，
$('input[type=checkbox]').on('change', function (e) {
if ($('input[type=checkbox]:checked').length > 3) {
$(this).prop('checked', false);
alert("allowed only 3");
}
});
在JSFiddle中檢查一下
小唯快跑啊
TA貢獻1863條經驗 獲得超2個贊
試試這個DEMO：
$(document).ready(function () {
$("input[name='vehicle']").change(function () {
var maxAllowed = 3;
var cnt = $("input[name='vehicle']:checked").length;
if (cnt > maxAllowed)
{
$(this).prop("checked", "");
alert('Select maximum ' + maxAllowed + ' Levels!');
}
});
});
- 3 回答
- 0 關注
- 685 瀏覽
添加回答
舉報
0/150
提交
取消