jQuery技术

优就业WEB前端教程-jquery操作复选框(checkbox)的12个小技巧总结

字号+ 作者:H5之家 来源:H5之家 2016-05-28 11:00 我要评论( )

1、获取单个checkbox选中项(三种写法)$(input:checkbox:checked).val()或者$(input:[type=#39;checkbox#39;]:checked).val();或者$(input:[name=#39;ck#39;]:che

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

});

更多知识干货分享,尽在IT优就业。

更多精彩可微信搜索公众号【优就业】

免责声明:本文来源于博客园,由网友提供或网络搜集,仅供个人研究、交流学习使用,不涉及商业盈利目的。如有版权问题,请联系本站管理员予以更改或删除。优知网会定期发布Web前端相关趋势文章,包括 等领域,敬请关注!

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Flexslider图片轮播、文字图片相结合滑动切换效果

    Flexslider图片轮播、文字图片相结合滑动切换效果

    2016-04-16 12:00

  • WEB前端开发都应知道的jquery小技巧及jquery三个简写 jQuery

    WEB前端开发都应知道的jquery小技巧及jquery三个简写 jQuery

    2016-02-29 12:13

  • web前端开发学习路线

    web前端开发学习路线

    2015-11-19 16:51

  • 优就业Web前端教程-每个程序员都会的35个 jQuery 小技巧

    优就业Web前端教程-每个程序员都会的35个 jQuery 小技巧

    2015-11-18 16:39

网友点评
o