js对RadioButton和CheckButton的操作，在网站开发中会经常遇到，而JQuery操作RadioButton和CheckButton非常便捷。小编觉得网站开发人员有必要熟练掌握。所以小编决定写一篇文章总结一下。小编能力有限，但是有膀子力气。老少爷们能不能点个赞呢？

RadioButton的基础操作

1.获取RadioButton
$("input[name=gender]")
或者是
$(":radio[name=gender]")
2.根据val设置选中
1）设置选中值得value
取得RadioButton的选中值，被选中的radio只有一个值，所以直接用val();
$("input[name=gender]").val(["女"]);
或者是
$(":radio[name=gender]").val(["女"]);
PS:注意val中的参数的【】不能省略，val()的参数必须是一个数组，尽管有时只有一个值。
2）设置选中
设置RadioButton的选中值： .attr('checked',true);
 

对于CheckBox和Select列表框

对RadioButton的选择技巧对于CheckBox和Select列表框也适用

除了可以使用val批量设置RadioButton、CheckBox等的选中以外，还可以设定checked属性来单独设置控件的选中状态

$(‘#selOne’).val([‘1’,’2’,’3’]);//同时设置多个下拉菜单选中

$("#btn1").attr("checked",true)

案例（全选、反选、全部选）

代码：

<script type="text/javascript">

    $(function(){

        //全选

        $('#btnAll').click(function(){

            $('div :checkbox').attr('checked',true);

        });

        //全不选

        $('#btnNoAll').click(function(){

            $('div :checkbox').attr('checked',false);

        });

        //反选

        $('#btnFanXuan').click(function(){

           $('div :checkbox').each(function(){

               $(this).attr('checked',!$(this).attr('checked'));

           });

        });

    });

    </script>

</head>

<body>

<input type="button"name="name"value="全选"id="btnAll"/>

<input type="button"name="name"value="全不选"id="btnNoAll"/>

<input type="button"name="name"value="反选"id="btnFanXuan"/>

<div>

    <input type="checkbox"name="name"value="1"/>吃饭

    <input type="checkbox"name="name"value="2"/>睡觉

    <input type="checkbox"name="name"value="3"/>打豆豆

</div>

</body>

JQuery对RadioButton和CheckButton的操作的更多相关文章

  1. jquery select取值，赋值操作

    select">jquery select取值,赋值操作 一.获取Select 获取select 选中的 text : $("#ddlRegType").find( ...

  2. jQuery对下拉框Select操作总结

    jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...

  3. jQuery获取checkbox选中项等操作及注意事项

    jQuery获取checkbox选中项等操作及注意事项 今天在做一个项目功能时需要显示checkbox选项来让用户进行选择,由于前端不是很熟练,所以做了一个简单的Demo,其中遇到一些小问题,特记录下 ...

  4. jQuery（6）——jQuery对表单、表格的操作及更多应用

    jQuery对表单.表格的操作及更多应用 [表单应用] 一个表单有表单标签.表单域及表单按钮三个基本部分. 单行文本框应用:获取和失去焦点改变样式. 也可以用CSS中的伪类选择符来实现,但是IE6并不 ...

  5. Javascript Jquery 中的数组定义与操作_子木玲_新浪博客

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  6. jQuery（三）：样式操作

    一.DOM操作分类 DOM Core:任何一种支持DOM的编程语言都可以使用它,例如:getElementById(). HTML-DOM:用于处理HTML文档,例如:document.forms. ...

  7. 第一百七十一节，jQuery，高级事件，模拟操作,命名空间,事件委托,on、off 和 one

    jQuery,高级事件,模拟操作,命名空间,事件委托,on.off 和 one 学习要点: 1.模拟操作 2.命名空间 3.事件委托 4.on.off 和 one jQuery 不但封装了大量常用的事 ...

  8. 第一百六十六节，jQuery，基础 DOM 和 CSS 操作，元素内容，元素属性，css和class，元素宽度高度、偏移、滚动条

    jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...

  9. jQuery 对表单、表格的操作及更多应用-简略笔记

    [jQuery 对表单.表格的操作及更多应用] jquery对表单及表格的操作是实际应用中相当广泛. 对于表单的操作,可以实现 (1)获取和失去焦点改变样式: (2)在多行文本框中可以实现网站评论框的 ...

随机推荐

  1. 第15章 磁盘配额（Quota）与高级文件系统管理

    磁盘配额(quota)的应用与实践 什么是quota 举例来说,用户的默认主文件夹是在/home下面,如果/home是个独立的分区,假设是10G,/home下有30个账号,这样30个用户共享这10G的 ...

  2. Swift-闭包使用及解决循环引用问题

    Swift中闭包使用参考OC中block使用,基本一致 // 闭包类型 首先写(参数列表)->(返回值类型) func loadData(callBack : (jsonData:String) ...

  3. TCP系列46—拥塞控制—9、SACK下的快速恢复与Limited transmit

    一.概述 1.SACK下的特殊处理过程 SACK下的拥塞控制处理是linux中拥塞控制的实现依据,再次强调一遍RFC6675的重要性,linux中拥塞控制主体框架的实现是与RFC6675一致的,所以如 ...

  4. CNN误差反传时旋转卷积核的简明分析（转）

    CNN(卷积神经网络)的误差反传(error back propagation)中有一个非常关键的的步骤就是将某个卷积(Convolve)层的误差传到前一层的池化(Pool)层上,因为在CNN中是2D ...

  5. SQL优化套路

    直奔主题: (1) SELECT(2) DISTINCT <SELECT_LIST>(3) FROM <LEFT_TABLE> <JOIN_TYPE> (4) JO ...

  6. CF712E Memory and Casinos 期望概率

    题意:\(n\)个赌场,每个赌场有\(p_{i}\)的胜率,如果赢了就走到下一个赌场,输了就退回上一个赌场,规定\(1\)号赌场的上一个是\(0\)号赌场,\(n\)号赌场的下一个是\(n + 1\) ...

  7. Codeforces710

    [未完待续] A The only king stands on the standard chess board. You are given his position in format &quo ...

  8. Win10如何搭建FTP服务器以实现快速传输文件

    原文链接地址:http://blog.csdn.net/bai_langtao/article/details/77751447 Win10如何搭建FTP服务器以实现快速传输文件?相信大家在工作或生活 ...

  9. 十五分钟介绍 Redis数据结构--学习笔记

    下面是一个对Redis官方文档<A fifteen minute introduction to Redis data types>一文的翻译,如其题目所言,此文目的在于让一个初学者能通过 ...

  10. Codeforces 576C. Points on Plane（构造）

    将点先按x轴排序,把矩形竖着划分成$10^3$个块,每个块内点按y轴排序,然后蛇形走位上去. 这样一个点到下一个点的横坐标最多跨越$10^3$,一共$10^6$个点,总共$10^9$,一个块内最多走$ ...