张映 发表于 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. Maven-01: Maven入门

    先看看开发环境: 我们在E盘下新建一个文件夹叫helloworld,这个文件夹下建一个src文件夹和一个文件pom.xml. src下的目录结构为: pom.xml文件内容为: <?xml ve ...

  2. Kotlin——从无到有系列之中级篇(四):面向对象的特征与类(class)继承详解

    如果您对Kotlin很有兴趣,或者很想学好这门语言,可以关注我的掘金,或者进入我的QQ群大家一起学习.进步. 欢迎各位大佬进群共同研究.探索 QQ群号:497071402 进入正题 在前面的章节中,详 ...

  3. 使用Docker快速搭建Nginx+PHP-FPM环境

    下载nginx官方镜像和php-fpm镜像 docker pull nginx docker pull bitnami/php-fpm 使用php-fpm镜像开启php-fpm应用容器 docker ...

  4. 21.C++- "++"操作符重载、隐式转换之explicit关键字、类的类型转换函数

    ++操作符重载 ++操作符分为前置++和后置++,比如: ++a;  a++; ++操作符可以进行全局函数或成员函数重载 重载前置++操作符不需要参数 重载后置++操作符需要一个int类型的占位参数 ...

  5. sqlite语句主页

    因为现在android手机用sqlite数据,但是sql语句很多和sqlserver不同..所以还是把官网记下以便开发:http://www.sqlite.org/lang.html

  6. 201621123062《java程序设计》第九周作业总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 思维导图1:(对集合部分做了一些改动和细化) 思维导图2:(泛型) 1.2 选做:收集你认为有用的代码片段 代 ...

  7. 关于python中的operator.itemgetter()函数的用法

    1. operator.itemgetter(num)函数 表示对对象的第num维数据进行操作获取. >>>import operator >>>a = [1, 2 ...

  8. 20162317袁逸灏 第八周实验报告:实验二 Java面向对象程序设计

    20162317袁逸灏 第八周实验报告:实验二 Java面向对象程序设计 实验内容 初步掌握单元测试和TDD 理解并掌握面向对象三要素:封装.继承.多态 初步掌握UML建模 熟悉S.O.L.I.D原则 ...

  9. 事后诸葛亮——城市安全风险管理项目Postmortem结果

    设想和目标 1. 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 本系统希望实现快速识别危害因素,使工作人员对风险作出准确的评估.即让使用者熟悉潜在的危险因素,知道 ...

  10. Django 个性化管理员站点

    from django.contrib import admin # Register your models here. from .models import Moment class Momen ...