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 ...
随机推荐
- Java-MyBatis-MyBatis3-XML映射文件:XML映射文件
ylbtech-Java-MyBatis-MyBatis3-XML映射文件:XML映射文件 1. XML 映射文件 MyBatis 的真正强大在于它的映射语句,这是它的魔力所在.由于它的异常强大,映射 ...
- matlab调用keras深度学习模型(环境搭建)
matlab没有直接调用tensorflow模型的接口,但是有调用keras模型的接口,而keras又是tensorflow的高级封装版本,所以就研究一下这个……可以将model-based方法和le ...
- python学习笔记4.2_正则表达式
常用正则表达式:http://tool.chinaz.com/regex/ 1.正则表达式:提供了一种在文本中灵活查找或匹配字符串模式的方法.单个表达式通常被称为regex. 2.python的re模 ...
- QC的安装和配置
QC(Quality center)的安装配置 Wmware 虚拟机 数据库SQL server2000 Windows server 2003 须安装数据库的sp4补丁包 注意事项 数据库安装时选择 ...
- Activiti流程定义语言
1.流程(process) bpmn文件一个流程的根元素.一个流程就代表一个工作流. 2.顺序流(sequenceFlow) 顺序流是连接两个流程节点的连线,代表一个节点的出口.流程执行完一个节点后, ...
- nginx配置虚拟主机的两种方式
一. 通过端口区分不同的虚拟主机 二. 通过域名区分不同的虚拟主机 备注: 1)hosts文件路径:
- Spring_关于@Resource注入为null解决办法
初学spring,我在dao层初始化c3p0的时候,使用@Resource注解新建对象是发现注入为null,告诉我 java.lang.NullPointerException. @Repositor ...
- ROS urdf和xacro文件详解
视觉标签:visual <visual> <origin xyz="0.0 0.0 0.0" /> <geometry> <box siz ...
- Web交互增强
刚刚google了一下这个概念,在其他的领域已经存在了这个概念,但是web方面还是没有被人提及的,所以我在这里第一次声明web方面的交互增强 交互增强 (interaction enhance) 相对 ...
- tmux连接时多个显示器分别显示不同的窗口大小
如果两个电脑连接同一个tmux,但是他们各自的显示器大小不同,那么就会在一个显示器部分会显示灰色区.在tmux里面有个设置可以更改,在tmux里面输入命令 tmux set-window-opti ...