张映 发表于 2013-07-16

分类目录: js/jquery

标签:checkbox, jquery, radio, 选中

jquery 很灵活,checkbox radio标签选中的方法有很多,在这儿就例举三个常用的方法。

一,测试html

  1. <div style="margin-top:150px;">
  2. <input type='checkbox' name='test[]' class='checkbox' value='checkbox1'>checkbox1
  3. <input type='checkbox' name='test[]' class='checkbox' value='checkbox2'>checkbox2
  4. <input type='checkbox' name='test[]' class='checkbox' value='checkbox3'>checkbox3
  5. </div>
  6. <div style="margin-top:50px;">
  7. <input type="radio" name="test1" value = "radio1" class='radio' >radio1
  8. <input type="radio" name="test1" value = "radio2" class='radio' >radio2
  9. <input type="radio" name="test1" value = "radio3" class='radio' >radio3
  10. </div>

二,checkbok,radio选中

方法1,

  1. //这二个方法属于一类
  2. $('.checkbox:checked');
  3. $('input[type^=checkbox]:checked');

方法2,

  1. $('.checkbox').filter(':checked');

方法3

  1. $('.checkbox').each(function(){
  2. if($(this).is(":checked")){
  3. alert($(this).val()+": is checked");
  4. }else{
  5. alert($(this).val()+": is not checked");
  6. }
  7. })

将上面的.checkbox换成.radio,就可以判断radio标签的选中了

jquery checkbox radio 标签 选中的3种方法的更多相关文章

  1. JQuery判断radio是否选中,获取选中值

    本文摘自:http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html   /*----------------------- ...

  2. JQuery判断radio是否选中并获取选中值的示例代码

    这篇文章主要介绍了JQuery判断radio是否选中并获取选中值的方法,代码很简单,但很实用,需要的朋友可以参考下 其他对radio操作功能,以后在添加.直接上代码,别忘记引用JQuery包 ? 1 ...

  3. 使用 jQuery 实现 radio 的选中与反选

    使用 jQuery 实现 radio 的选中与反选 我们知道在 Html 中当我们选中一个radio后,再次点击该 radio,那么该 radio 依然是一个选中的状态,但是有时我们需要实现这样的逻辑 ...

  4. 解析Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下   DOM方法:父窗口操作IFRAME:window.frames[&q ...

  5. jQuery属性选择器.attr()和.prop()两种方法

    在判断表单单选框是否被选中时,通常会想到使用$('#checkbox').attr('checked')来判断,但在一些情况下,你会发现这种方法并不管用,得到的是undefined. 原来jQuery ...

  6. Jquery取得iframe中元素的几种方法(转载)

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作 DOM方法:父窗口操作IFRAME:window.frames["iframeSon ...

  7. [浪风转载]Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作 DOM方法:父窗口操作IFRAME:window.frames["iframeSon ...

  8. js 跨域 Jquery取得iframe中元素的几种方法

    http://www.jb51.net/article/34942.htm 收集利用Jquery取得iframe中元素的几种方法 : 父页面访问子页面 $(document.getElementByI ...

  9. (一)JQuery动态加载js的三种方法

    Jquery动态加载js的三种方法如下: 第一种: $.getscript("test.js"); 例如: <script type="text/javascrip ...

随机推荐

  1. poj2793 素数和

    题目链接:http://poj.org/problem?id=2739 #include<iostream> using namespace std; int count=0; int p ...

  2. Docker 网络管理及容器跨主机通信

    1.网络模式 docker支持四种网络模式,使用--net选项指定: host,--net=host,如果指定此模式,容器将不会获得一个独立的network namespace,而是和宿主机共用一个. ...

  3. 设计模式 --> (9)代理模式

    代理模式 为其他对象提供一种代理以控制对这个对象的访问. 主要解决的问题是:在直接访问对象时带来的问题,比如说:要访问的对象在远程的机器上.在面向对象系统中,有些对象由于某些原因(比如对象创建开销很大 ...

  4. kvm之六:配置kvm虚拟机通过VNC访问

    1.网络安装的snale2没有添加VNC访问方式,配置如下 [root@kvm ~ ::]#virsh edit snale2 插入如下配置: <graphics type=' autoport ...

  5. Nginx技巧——Nginx/Apache下禁止指定目录运行PHP脚本(转自运维之美)

    网站程序的上传目录通常是不需要PHP执行解释权限,通过限制目录的PHP执行权限可以提网站的安全性,减少被攻击的机率. 下面和大家一起分享下如何在Apache和Nginx禁止上传目录里PHP的执行权限. ...

  6. 【Android】带进度条的WebView

    http://www.cnblogs.com/over140/archive/2013/03/07/2947721.html

  7. Suricata默认规则集相关

    Suricata规则集 Suricata 基于规则检测和控制数据流量,所有规则的配置文件保存在rules目录内 .这些是已知和确认的活动僵尸网络和其C&C(command and contro ...

  8. 记录python接口自动化测试--pycharm执行测试用例时需要使用的姿势(解决if __name__ == "__main__":里面的程序不生效的问题)(第三目)

    1.只运行某一条case 把光标移动到某一条case后面,然后右键,选择"Run..."来运行程序 此时,pycharm会只运行光标所在位置的这一条case 2.如果想执行全部ca ...

  9. C语言程序设计基础-第1周作业-初步

    1.安装带有计算机术语的翻译软件 2.在自己电脑上安装C编译器,windows系统建议安装dev-c++,其他系统自行查找. 3.加入课程小组,有任何疑问可以在小组中提问:https://group. ...

  10. js 点击 返回顶部 动画

    附上效果图 触发前 触发后 HTML代码: CSS代码 JS代码 由于复制文本太丑了 所以直接放的图片  但是我在评论区把js代码又复制了一边 以便你们使用