checkbox的全选,取消全选,获得选中值
<html>
<head>
<title>jq全选以及获得选中项的值</title>
<meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.4.1/jquery.js"></script>
<script>
$(function() {
$("#select").click(function() {
if ($(this).attr("checked")) {
$("input[name=items]").each(function() {
$(this).attr("checked", true);
});
} else {
$("input[name=items]").each(function() {
$(this).attr("checked", false);
});
}
});
//得到选中的值,ajax操作使用
$("#submit").click(function() {
var text="";
$("input[name=items]").each(function() {
if ($(this).attr("checked")) {
text += ","+$(this).val();
}
});
alert(text);
});
});
</script>
</head>
<body>
<form action="#" method="post">
<input type="checkbox" value="1" name="items"><br/>
<input type="checkbox" value="2" name="items"><br/>
<input type="checkbox" value="3" name="items"> <br/>
<input type="checkbox" value="4" name="items"> <br/>
<input type="checkbox" value="5" name="items"> <br/>
<input type="checkbox" value="6" name="items"> <br/>
<input type="checkbox" value="7" name="items"> <br/>
<input type="checkbox" value="8" name="items"> <br/>
<input type="checkbox" value="9" name="items"> <br/>
<input type="checkbox" value="10" name="items"> <br/>
<input type="checkbox" value="11" name="items"> <br/>
<input type="checkbox" id="select"/> 全选<br/>
<input type="submit" id="submit" value="提交">
</form>
</body>
</html>
好像高版本的jq库会有问题,待研究。。。。。
checkbox的全选,取消全选,获得选中值的更多相关文章
- Jquery CheckBox复选框 全选/取消全选 最佳实现方式 参考案例
<input id="chkAll" type="checkbox" />全选/取消全选</div> <asp:Repeater ...
- html checkbox 实现全选/取消全选
html checkbox 实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...
- checkbox全选/取消全选
//checkbox全选/取消全选 $(function() { $("#checkAll").click(function() { if(this.checked){ $(&qu ...
- 【转载】checkbox实现全选/取消全选
比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...
- jQuery--checkbox全选/取消全选
用JavaScript使页面上的一组checkbox全选/取消全选,逻辑很简单,实现代码也没有太难的语法.但使用jQuery实现则更简单,代码也很简洁,精辟! jQuery版本:1.3.2 <h ...
- AngularJS--购物车全选/取消全选功能实现
刚学习angularJS,于是练习写了一个类似于购物车的全选/取消全选的功能,主要实现的功能有: 1.勾选全选checkbox,列表数据全部被勾选,取消同理,用ng-model实现双向绑定: 2.选中 ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- Vue 全选/取消全选,反选/取消反选
这是一个组件: <template> <div> <div> <input type="checkbox" v-model="i ...
- vue实现功能 单选 取消单选 全选 取消全选
vue实现功能 单选 取消单选 全选 取消全选 代码部分 <template> <div class=""> <h1>全选框</h1> ...
- jquery checkbox勾选取消勾选的诡异问题
jquery checkbox勾选/取消勾选的诡异问题jquery checkbox勾选/取消勾选的诡异问题 <form> 你爱好的运动是?<input type=&q ...
随机推荐
- python生成word中文字体
python生成word中文字体 我们今天用python生成word文件,主要是用到了PyRTF包生成rtf文件,由于PyRTF的包中文教程比较少,所以特此记录几篇文章,也希望给大家有一些帮助. 开始 ...
- PAT甲级——A1085 Perfect Sequence
Given a sequence of positive integers and another positive integer p. The sequence is said to be a p ...
- java流对象
Java和C++都是静态类型的面向对象编程语言 stream结尾都是字节流,reader和writer结尾都是字符流 区别: 就是读写的时候一个是按字节读写,一个是按字符. 实际使用通常差不多. 在读 ...
- Python学习day09 - Python进阶(3)
figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...
- CAS客户端配置
1. 导出证书 以上操作会在当前目录产生文件:ssodemo.crt(需要用到的文件请看CAS服务端配置那篇文章) 2. 客户端导入证书 以上操作会在jdk安装目录jre\lib\security下产 ...
- Linux 启动dubbo管控台:
- IDEA2018激活码
请复制如下内容到文本编辑器(如notepad++)把博客的内容去掉 N757JE0KCT-eyJsaWNlbnNlSWQiOiJONzU3SkUwS0NUIiwibGljZW5zZWVOYW1lIjo ...
- Django项目:CMDB(服务器硬件资产自动采集系统)--06--06CMDB测试Linux系统采集硬件数据的命令01
#base.py # ————————01CMDB获取服务器基本信息———————— from config import settings #配置文件 class BasePlugin(object ...
- wampserver配置服务
搭建服务器 windows下: 安装`WampServer`软件 1.什么是WampServer: WampServer,一般称之为 WAMP ,就是Windows Apache Mysql PHP集 ...
- Java通过接口或者抽象类调用方法的时候,怎么知道调用的是哪个实现类里的方法?
用对象的 getClass() 方法获得它的类,之后就可以随意去判断这是哪个实现类了. 比如代码1-1所示的JDBC连接池的代码,我们想要知道conn调用的close方法是释放连接还是归还连接, 我们 ...