jQuery实现checkbox单选
有时候使用多选框的样式但是想实现单选的功能,如下:
有多个多选框:
<input type="checkbox" name="value1" class="checkbox" value="1"> value 1<br>
<input type="checkbox" name="value2" class="checkbox" value="2"> value 2<br>
<input type="checkbox" name="value3" class="checkbox" value="3"> value 3<br>
jQuery:
$(document).ready(function(){
// 监听多选框的点击
$('.checkbox').on('click', function(){
// 先将所有checkbox的选中状态取消
$('.checkbox').prop('checked', false);
// 然后将当前checkbox设为选中状态
$(this).prop('checked', true);
});
});
或者:
$(document).ready(function(){
// 监听多选框的点击
$('.checkbox').on('click', function(){
// 获取当前点击框的name值或其他值
var checkbox_name = $(this).attr("name");
// 取消其他checkbox的选中状态
$("input[name='"+checkbox_name+"']").not(this).prop('checked', false);
});
});