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 RSA验签
这几天在跟一个php的小哥哥联调接口,遇到了一些问题记录下来, 直接上代码吧,亲测有效 import org.slf4j.Logger; import org.slf4j.LoggerFactory; ...
- 07_jQuery对象初识(五)事件(非常重要)
1. 目前为止学过的绑定事件的方式 1. 在标签里面写 onclick=foo(this); 2. 原生DOM的JS绑定 DOM对象.onclick=function(){...} 3. jQuery ...
- js 面向对象类
类的声明 继承的几种方法 类的声明 第一种 function car(){ this.name = 'name'; } 第二种.es6中新添加的 class car(){ constructor(){ ...
- storm一些可调节的参数
# Licensed to the Apache Software Foundation (ASF) under one # or more contributor license agreeme ...
- iPadOS 更新日志 - 持续更新中
本文只是为了简单记录一下每个正式版本发布时间和更新内容,只有这个初衷,从2019年9月25日开始,将会持续更新. iPadOS 13.1 - 2019年9月25日 经全新命名的 iPadOS 是一款强 ...
- 2019-5-21-C#-在-构造函数添加-CallerMemberName-会怎样
title author date CreateTime categories C# 在 构造函数添加 CallerMemberName 会怎样 lindexi 2019-05-21 11:28:32 ...
- nfs 原理详解
一.NFS介绍 1)什么是NFS 它的主要功能是通过网络让不同的机器系统之间可以彼此共享文件和目录.NFS服务器可以允许NFS客户端将远端NFS服务器端的共享目录挂载到本地的NFS客户端中.在本地的N ...
- HZOI20190821模拟28题解
题面:https://www.cnblogs.com/Juve/articles/11390839.html 所有官方正解在我的文件里 A. 虎 算法1:我们发现非关键边与黑色边去掉以后,答案就是将所 ...
- Java的跨平台特性
语言跨平台是编译后的文件跨平台,而不是源程序跨平台.Java源代码首先经过编译器生成字节码,即class文件,该class文件与平台无关,而class文件经过解释执行之后翻译成最终的机器码,这是平台相 ...
- [jeecms]获取父栏目下的子栏目名称
[@cms_channel_list parentId='父栏目id'] [#list tag_list as c] <a href="${c.url}">${c.na ...