jQuery操作CheckBox的方法介绍(选中,取消,取值)


Posted in Javascript onFebruary 04, 2014
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">   
<HTML>   
 <HEAD>   
  <TITLE> New document.nbsp;</TITLE>   
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />   
    <SCRIPT LANGUAGE="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>   
  <SCRIPT LANGUAGE="javascript">   
  <!--   
   $("document.quot;).ready(function(){       $("#btn1").click(function(){   
    $("[name='checkbox']").attr("checked",'true');//全选   
    })   
       $("#btn2").click(function(){   
    $("[name='checkbox']").removeAttr("checked");//取消全选   
    })   
    $("#btn3").click(function(){   
    $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数   
    })   
    $("#btn4").click(function(){   
    $("[name='checkbox']").each(function(){   
      
     if($(this).attr("checked"))   
   {   
    $(this).removeAttr("checked");   
   }   
   else  
   {   
    $(this).attr("checked",'true');   
   }   
    })   
    })   
     $("#btn5").click(function(){   
    var str="";   
    $("[name='checkbox'][checked]").each(function(){   
     str+=$(this).val()+""r"n";   
   //alert($(this).val());   
    })   
   alert(str);   
    })   
   })   
  //-->   
  </SCRIPT>   
 </HEAD>   
 <BODY>   
 <form name="form1" method="post" action="">   
   <input type="button" id="btn1" value="全选">   
   <input type="button" id="btn2" value="取消全选">   
   <input type="button" id="btn3" value="选中所有奇数">   
   <input type="button" id="btn4" value="反选">   
   <input type="button" id="btn5" value="获得选中的所有值">   
   <br>   
   <input type="checkbox" name="checkbox" value="checkbox1">   
   checkbox1   
   <input type="checkbox" name="checkbox" value="checkbox2">   
   checkbox2   
   <input type="checkbox" name="checkbox" value="checkbox3">   
   checkbox3   
   <input type="checkbox" name="checkbox" value="checkbox4">   
   checkbox4   
   <input type="checkbox" name="checkbox" value="checkbox5">   
   checkbox5   
   <input type="checkbox" name="checkbox" value="checkbox6">   
   checkbox6   
   <input type="checkbox" name="checkbox" value="checkbox7">   
   checkbox7   
   <input type="checkbox" name="checkbox" value="checkbox8">   
 checkbox8   
 </form>  
Javascript 相关文章推荐
JavaScript与函数式编程解释
Apr 27 Javascript
kmock javascript 单元测试代码
Feb 06 Javascript
IE的有条件注释判定IE版本详解(附实例代码)
Jan 04 Javascript
仿谷歌主页js动画效果实现代码
Jul 14 Javascript
jquery实现checkbox 全选/全不选的通用写法
Feb 22 Javascript
HTML5 canvas 9绘制图片实例详解
Sep 06 Javascript
JavaScript中绑定事件的三种方式及去除绑定
Nov 05 Javascript
H5实现仿flash效果的实现代码
Sep 29 Javascript
深入理解ES6中let和闭包
Feb 22 Javascript
vue mounted 调用两次的完美解决办法
Oct 29 Javascript
使用Jenkins部署React项目的方法步骤
Mar 11 Javascript
解决vue组件props传值对象获取不到的问题
Jun 06 Javascript
jquery操作复选框(checkbox)的12个小技巧总结
Feb 04 #Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 #Javascript
jquery判断元素的子元素是否存在的示例代码
Feb 04 #Javascript
jquery中get,post和ajax方法的使用小结
Feb 04 #Javascript
jquery中get和post的简单实例
Feb 04 #Javascript
jquery中$.post()方法的简单实例
Feb 04 #Javascript
用jQuery与JSONP轻松解决跨域访问的问题
Feb 04 #Javascript
You might like
ZF等常用php框架中存在的问题
2008/01/10 PHP
PHP程序员面试 切忌急功近利(更需要注重以后的发展)
2010/09/01 PHP
浅析Yii中使用RBAC的完全指南(用户角色权限控制)
2013/06/20 PHP
使用symfony命令创建项目的方法
2016/03/17 PHP
PHP实现微信图片上传到服务器的方法示例
2017/06/29 PHP
PHP迭代与递归实现无限级分类
2017/08/28 PHP
jQuery之浮动窗口实现代码(两种方法)
2010/09/08 Javascript
javascript中不等于的代码是什么怎么写
2013/12/29 Javascript
JavaScript中具名函数的多种调用方式总结
2014/11/08 Javascript
Bootstrap3 内联单选和多选框
2016/12/29 Javascript
jQuery获取Table某列的值(推荐)
2017/03/03 Javascript
详解Vue内部怎样处理props选项的多种写法
2018/11/06 Javascript
tweenjs缓动算法的使用实例分析
2019/08/26 Javascript
JavaScript实现简单计算器功能
2019/12/19 Javascript
JavaScript碰撞检测原理及其实现代码
2020/03/12 Javascript
Python中用Spark模块的使用教程
2015/04/13 Python
对numpy的array和python中自带的list之间相互转化详解
2018/04/13 Python
详谈Numpy中数组重塑、合并与拆分方法
2018/04/17 Python
python 实现在txt指定行追加文本的方法
2018/04/29 Python
Django 跨域请求处理的示例代码
2018/05/02 Python
浅谈Python采集网页时正则表达式匹配换行符的问题
2018/12/20 Python
python3对拉勾数据进行可视化分析的方法详解
2019/04/03 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
python爬虫scrapy框架之增量式爬虫的示例代码
2021/02/26 Python
露营世界:Camping World
2017/02/02 全球购物
Python里面如何拷贝一个对象
2014/02/17 面试题
新学期家长寄语
2014/01/19 职场文书
家长学校实施方案
2014/03/15 职场文书
《假如》教学反思
2014/04/17 职场文书
党员廉洁自律承诺书
2014/05/26 职场文书
学习优秀党员杨宗兴先进事迹材料思想汇报
2014/09/14 职场文书
一份关于丢失公司财物的检讨书
2014/09/19 职场文书
学校纪律作风整改措施思想汇报
2014/10/11 职场文书
2015欢度元旦标语口号
2014/12/09 职场文书
2015年学校少先队工作总结
2015/07/20 职场文书
go xorm框架的使用
2021/05/22 Golang