张映 发表于 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. 面试:Handler 的工作原理是怎样的?

    面试场景 平时开发用到其他线程吗?都是如何处理的? 基本都用 RxJava 的线程调度切换,嗯对,就是那个 observeOn 和 subscribeOn 可以直接处理,比如网络操作,RxJava 提 ...

  2. 涉及模式之 装饰器模式详解(与IO不解的情缘)

    作者:zuoxiaolong8810(左潇龙),转载请注明出处,特别说明:本博文来自博主原博客,为保证新博客中博文的完整性,特复制到此留存,如需转载请注明新博客地址即可. LZ到目前已经写了九个设计模 ...

  3. iPhone页面的常用调试方法

    在iPhone中调试,大体上与上文 安卓中的移动页面调试 类似,区别主要是iOS系统中的一些限制,导致某些工具无法使用. 本文基于此,简要介绍在iPhone中如何调试页面. 最终可以实现在Mac平台使 ...

  4. Property 'id' not found on type java.lang.String

    改为 忘写了$符,取不出来,因此报错!

  5. Leetcode 17.——Letter Combinations of a Phone Number

    Given a digit string, return all possible letter combinations that the number could represent. A map ...

  6. 【转载】NetFPGA-1G-CML从零开始环境配置

    ##环境 深度Linux ###环境配置 ```bash sudo apt-get install libsigc++ sudo apt-get install qgit sudo apt-get i ...

  7. Beta集合

    Beta冲刺day1 Beta冲刺day2 Beta冲刺day3 Beta冲刺day4 Beta冲刺day5 Beta冲刺day6 Beta冲刺day7 测试总结 总结合集 Beta预备

  8. Flask 扩展 表单

    pip install flask-wtf 一个简单的表单 from flask_wtf import Form from wtforms import StringField from wtform ...

  9. 自主学习之RxSwift(二) -----flatMap

    最近项目中有这么一个需求,下面是三个网络请求 A.从服务器获取到时间戳(GET 方法,获取 timeLine) B.进行用户头像上传,获得回传的URL(POST方法,参数为 userId, timeL ...

  10. 《javascript设计模式与开发实践》阅读笔记(12)—— 享元模式

    享元模式 享元(flyweight)模式是一种用于性能优化的模式,"fly"在这里是苍蝇的意思,意为蝇量级.享元模式的核心是运用共享技术来有效支持大量细粒度的对象. 享元模式的核心 ...