JQuery CheckBox（复选框）操作方法汇总

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());
            }
     });

或者

代码如下:

('input:checkbox').map(function () {            
   return(this).val();
}).get().join(',') ;

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);
});

赞 (0)

相关推荐

  • jquery判断checkbox(复选框)是否被选中的代码

    复制代码 代码如下: //是否被选中验证有选中的return true,否return false function mycheckbox() { var falg = 0; $("input[name='soft[]']:checkbox").each(function () { if ($(this).attr("checked")) { falg += 1; } }) if (falg > 0) return true; else return fals

  • jquery操作复选框checkbox的方法汇总

    本文实例汇总了jquery操作复选框checkbox的方法.分享给大家供大家参考.具体分析如下: jquery判断checked的三种方法: 复制代码 代码如下: $("input").attr("checked");   //版本1.6+返回:"checked"或"undefined" ,1.5-返回:true或false  $("input").prop("checked");  /

  • JQUERY复选框CHECKBOX全选,取消全选

    复制代码 代码如下: <script type="text/javascript"> $(function() { $("#checkall").click(function() { $("input[@name='checkname[]']").each(function() { $(this).attr("checked", true); }); }); $("#delcheckall").

  • 方便实用的jQuery checkbox复选框全选功能简单实例

    复制代码 代码如下: // 主复选框<input type="checkbox" id="ck" name="ckAll">// 子复选框项<input type="checkbox" id="ck1" name="ckItm"><input type="checkbox" id="ck2" name="ck

  • jquery复选框checkbox实现删除前判断

    实现这样一个基本需求,页面有很多数据,可以删除一条或多条,删除前判断是否选中至少一条,否则提示. 复制代码 代码如下: function deleteUser() { //当时是想把内容以str+=""的方式 进行保存 ,但不行 //var str; var array = new Array(); //用于保存 选中的那一条数据的ID var flag; //判断是否一个未选 $("input[name='selectFlag']:checkbox").each(

  • jquery复选框CHECKBOX全选、反选

    使用方法:我们先把下面的JS保存为有个文件,到时候调用,淡然你也可以直接写在页面内,推荐使用前者,方便重用: 复制代码 代码如下: (function($){ $.fn.checkgroup = function(options){ //merge settings settings=$.extend({ groupSelector:null, groupName:'group_name', enabledOnly:false },options || {}); var ctrl_box=thi

  • jquery操作复选框(checkbox)的12个小技巧总结

    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('che

  • 动态获取复选框checkbox选中个数的jquery代码

    动态获取复选框checkbox选中个数的jquery代码

    今天碰到"jquery动态获取复选框checkbox选中的个数",首先看下面例子: 复制代码 代码如下: <input type="checkbox" checked="checked">python<br> <input type="checkbox" checked="checked">java<br> <input type="check

  • jQuery对checkbox 复选框的全选全不选反选的操作

    jQuery对checkbox 复选框的全选全不选反选的操作

    先给大家展示下效果图,如果大家感觉还不错,请继续参考实现代码. HTML代码: <body> <ul id="list"> <li><label><input type="checkbox" name="items" value="1"> 1.时间都去哪儿了</label></li> <li><label><inp

  • jQuery判断checkbox(复选框)是否被选中以及全选、反选实现代码

    jQuery判断checkbox(复选框)是否被选中:if($("#id").attr("checked")==true) jQuery实现checkbox(复选框)选中.全选/反选代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transiti

随机推荐