1. 获取单个checkbox
选中项(三种写法):
$("input:checkbox:checked").val()
或者
$("input:[type='checkbox']:checked").val();
或者
$("input:[name='ck']:checked").val();
2. 获取多个checkbox
选中项:
$('input:checkbox').each(function() {
if ($(this).attr('checked') ==true) {
alert($(this).val());
}
});
3. 设置第一个checkbox
为选中值:
$('input:checkbox:first').attr("checked",'checked');
或者
$('input:checkbox').eq(0).attr("checked",'true');
4. 设置最后一个checkbox
为选中值:
$('input:radio:last').attr('checked', 'checked');
或者
$('input:radio:last').attr('checked', 'true');
5. 根据索引值设置任意一个checkbox
为选中值:
$('input:checkbox).eq(索引值).attr('checked', 'true');索引值=0,1,2....
或者
$('input:radio').slice(1,2).attr('checked', 'true');
6. 选中多个checkbox
:
同时选中第1个和第2个的checkbox
:
$('input:radio').slice(0,2).attr('checked','true');
7. 根据Value
值设置checkbox
为选中值:
$("input:checkbox[value='1']").attr('checked','true');
8. 删除Value=1
的checkbox
:
$("input:checkbox[value='1']").remove();
9. 删除第几个checkbox
:
$("input:checkbox").eq(索引值).remove();索引值=0,1,2....
如删除第3个checkbox
:
$("input:checkbox").eq(2).remove();
10.遍历checkbox
:
$('input:checkbox').each(function (index, domEle) {
//写入代码
});
11.全部选中
$('input:checkbox').each(function() {
$(this).attr('checked', true);
});
12.全部取消选择:
$('input:checkbox').each(function () {
$(this).attr('checked',false);
});
Jquery
通过遍历数组给checkbox
赋默认值
需求:有一个数组:(北京菜,粤菜),checkbox
如下:
现在想通过遍历这个数组,使数组里包含的值,在checkbox
选中
代码:
var flavors = new Array([北京菜 , 粤菜]);
$.each(flavors,function(i,item){
$("input[name='checkboxFlavor'][value="+item+"]").attr("checked","checked");
});
体会:选择器的
[]
可以有多重的选择条件
jquery
实现勾选复选框触发事件给input
赋值+回显复选框
<td class="as1">
<input type="checkbox" name="gdzc" value="1" id="t0" class="az"/><label for="t0" class="as">商品房</label>
<input type="checkbox" name="gdzc" value="2" id="t1" class="az"/><label for="t1" class="as">土地</label>
<input type="checkbox" name="gdzc" value="3" id="t2" class="az"/><label for="t2" class="as">厂房</label>
<input type="checkbox" name="gdzc" value="4" id="t3" class="az"/><label for="t3" class="as">企业产</label>
<input type="checkbox" name="gdzc" value="5" id="t4" class="az"/><label for="t4" class="as">底商</label>
<input type="checkbox" name="gdzc" value="6" id="t5" class="az"/><label for="t5" class="as">别墅</label>
<input type="checkbox" name="gdzc" value="7" id="t6" class="az"/><label for="t6" class="as">写字楼</label>
<input class="txtValue" type="hidden" type="text" id="qwer" name="com_fixed_assets" value="${application.com_fixed_assets}" />
</td>
js复选框
$(function() {
var count = 0;
$(".as1 :checkbox").click(function() {
var txtvalue = $(this).val();
if ($(".txtValue").val() == "") {
if ($(this).prop("checked") == true) {
var txtalso = $.trim(txtvalue);
} else {
var txtalso = "";
}
} else {
if ($(this).prop("checked") == true) {
var txtalso = $.trim($(".txtValue").val()) + "," + $.trim(txtvalue);
} else {
var txtelse = $.trim($(".txtValue").val());
var txtnow = $.trim(txtvalue);
var reg1 = "," + txtnow;
var reg2 = txtnow + ",";
var reg3 = txtnow;
var txtelse = txtelse.replace(reg1, "").replace(reg2, "").replace(reg3, "");
var txtalso = txtelse;
}
}
$(".txtValue").val(txtalso);
count++;
});
});
JS回显:
$(function(){
//当页面加载完成的时候,自动调用该方法
window.onload=function(){
//获得所要回显的值
var checkeds = $("#qwer").val();
//拆分为字符串数组
var checkArray =checkeds.split(",");
//获得所有的复选框对象
var checkBoxAll = $("input[name='gdzc']");
//获得所有复选框的value值,然后,用checkArray中的值和他们比较,如果有,则说明该复选框被选中
for(var i=0;i<checkArray.length;i++){
//获取所有复选框对象的value属性,然后,用checkArray[i]和他们匹配,如果有,则说明他应被选中
$.each(checkBoxAll,function(j,checkbox){
//获取复选框的value属性
var checkValue=$(checkbox).val();
if(checkArray[i]==checkValue){
$(checkbox).prop("checked",true);
}
})
}
}