Jquery 组 checkbox全选按钮

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title></title>
<style>
</style>
</head>
<body>
<form action="">
<input type="checkbox" name="items" value="足球"/>足球
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="羽毛球"/>羽毛球
<input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/>
<input id="CheckedAll" type="button" name="items" value="全选"/>
<input id="CheckedNo" type="button" name="items" value="全不选"/>
<input id="CheckedRev" type="button" name="items" value="反选"/>
<input id="send" type="button" name="items" value="提交"/>
</form>
</body>
<script src="js/jquery-1.11.3.js"></script>
<script>
//用原生js不会有问题
$("#CheckedAll").click(function(){
$('[name=items]:checkbox').each(function(){
this.checked=true;
});
});
$("#CheckedNo").click(function(){
$('[name=items]:checkbox').each(function(){
this.checked=false;
});
});
$("#CheckedRev").click(function(){
$('[name=items]:checkbox').each(function(){
this.checked=!this.checked;
});
});
$("#send").click(function(){
var str="你选中的是: \r\n";
$('[name=items]:checkbox').each(function(){
// 用this.checked或者用$(this).context.checked,用attr不行
if(this.checked){
str+=$(this).val()+"\r\n";
}
});
console.log(str);
})
</script>
</html>
Jquery 组 checkbox全选按钮的更多相关文章
- Jquery 组 checkbox全选checkbox
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...
- jQuery实现CheckBox全选、全不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery设置checkbox全选(区别jQuery版本)
jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery ...
- jquery中checkbox全选失效的解决方法
这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...
- Jquery小例子:全选按钮、加事件、挂事件;parent()语法;slideToggle()语法;animate()语法;元素的淡入淡出效果:fadeIn() 、fadeOut()、fadeToggle() 、fadeTo();function(e):e包括事件源和时间数据;append() 方法
function(e): 事件包括事件源和事件数据,事件源是指是谁触发的这个事件,谁就是事件源(div,按钮,span都可以是事件源),时间数据是指比如点击鼠标的事件中,事件数据就是指点击鼠标的左建或 ...
- 利用jQuery实现CheckBox全选/全不选/反选
转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...
- jQuery给CheckBox全选与不全选
$(function(){ $("#checkAll").click(function() {//全选 $('input[name="DATA"]').prop ...
- jQuery实现checkbox全选反选及删除等操作
1.list.html 说明:用checkbox数组Check[]存放每一行的ID值 <div id="con"> <table width="100% ...
- 解决jquery操作checkbox全选全不选无法勾选问题
最近在学习中使用jquery操作checkbox,使用下面方法进行全选.反选:$("input[name='checkbox']").attr("checked" ...
随机推荐
- DBN 大作业
- nginx和php-fpm调用方式
一.背景: 在开发中碰到一个问题,项目以nginx+php-fpm形式访问交互,结果访问项目时报错如下图: 二.分析: 提示很明确嘛,去看error.log(在nginx.conf或者vhost里 ...
- gitlab与jira集成
官方文档 https://docs.gitlab.com/ee/user/project/integrations/jira.html#doc-nav 提交代码时,在备注开头写上jira的工单号 ...
- Entangle 2.0 “Sodium”正式发布
导读 Entangle是一款自由而开源的软件,可让您从Linux控制DSLR相机. 使用各种尼康和佳能数码单反相机,可以查看实时预览,自动下载图像,并通过USB连接将照片拍摄到相机. 自上次听到Ent ...
- 作业二/Git的安装以及使用
作业要求来自https://edu.cnblogs.com/campus/gzcc/GZCC-16SE2/homework/2097 GitHub地址 https://github.com/20160 ...
- 学习CSS布局 - max-width
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HSF源码阅读
HSF各组成之间的关系 1 服务提供者注册与发布 <bean id="hsfTestService" class="com.test.service.impl.Hs ...
- 大话设计模式(C#)
还是那几句话: 学无止境,精益求精 十年河东,十年河西,莫欺少年穷 学历代表你的过去,能力代表你的现在,学习代表你的将来 问个问题: 如何写出高质量的代码?灵活,可扩展,易读,易维护,可重构,可复用. ...
- 随机森林和GBDT的几个核心问题
随机森林random forest的pro和con是什么?优势是accuracy高,但缺点是速度会降低,并且解释性interpretability会差很多,也会有overfitting的现象. 为什么 ...
- Node.js系列-express(下)
前言 距上次更新博客又两个月多了,这两个月内除了上班时间忙公司的项目外,下班后也没有闲着,做了点外包,有小程序的,管理端的项目.也可能那段时间做的外包项目也都比较急,所以晚上都搞到一点左右睡,严重的压 ...