jQuery应用操作之---复选框
1、示例1:
<form>
你最爱好的运动是?
<input type="checkbox" id="CheckedAll"/>全选<br/>
<input type="checkbox" id="CheckedNo"/>全不选<br/>
<input type="checkbox" id="CheckedRev"/>反选<br/>
<input type="checkbox" name="items" value="足球"/>足球
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="羽毛球"/>羽毛球
<input type="checkbox" name="items" value="乒乓球"/>乒乓球
<input type="button" id="send" value="提交"/>
</form>
全选:
$("#checkAll").click(function(){
$.("[name=items]: checkbox").attr("checked",true);
})
全不选:
$("#checkAll").click(function(){
$.("[name=items]: checkbox").attr("checked",false);
})
反选:
$("#checkRev").click(function(){
$.("[name=items]: checkbox").each(function(){
$(this).attr("checked",!$(this).attr("checked"));
})
})
JS原生的DOM方法比创建jQuery对象更为有效、简洁,简化后代码如下:
$("#checkRev").click(function(){
$.("[name=items]: checkbox").each(function(){
this.checked=!this.checked;
})
})
2、示例2:
<form>
你最爱好的运动是?
<input type="checkbox" id="CheckedAll"/>全选/全不选<br/>
<input type="checkbox" name="items" value="足球"/>足球
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="羽毛球"/>羽毛球
<input type="checkbox" name="items" value="乒乓球"/>乒乓球
<input type="button" id="send" value="提交"/>
</form>
单击id为"CheckedAll"复选框后,复选框组被选中,当复选框组中有一个或者更多没有被选中时,则需要取消id为"CheckedAll"的选中状态,有如下方法实现:
a)设置一个全选中/未全选中标志位,根据标志位设置"CheckedAll"复选框选中状态
$("[name=items]:checkbox").click(function(){
var flag = true;
$("[name=items]:checkbox").each(function(){
if(!this.checked){
flag = false;
}
});
$("#CheckAll").attr("checked",flag);
})
b) 判断复选框的总数是否与选中的复选框数量相等
$("[name=items]:checkbox").click(function(){
var $temp = $("[name=items]:checkbox");
$("#CheckAll").attr("checked",$temp.length==$temp.filter(":checked").length);
})
jQuery应用操作之---复选框的更多相关文章
- jquery:获取checked复选框的问题
jquery:获取checked复选框的问题 功能描述:要完成一个全选的功能,但总是获取不到复选框的被选中的个数,究其原因,是Jquery中length和checked使用不当所造成的. // 获取所 ...
- js操作checkbox(复选框)的方法总结
收集了一些用js代码操作checkbox复选框的代码,分享出来,供需要的朋友参考: <script> //复选框checkbox 处理方法 //搜集整理 www.jbxue.com fun ...
- JQuery:JQuery基本语法,JQuery选择器,JQuery DOM,综合案例 复选框,综合案例 随机图片
知识点梳理 课堂讲义 1.JQuery快速入门 1.1.JQuery介绍 jQuery 是一个 JavaScript 库. 框架:Mybatis (jar包) 大工具 插件:PageHelper (j ...
- jQuery+SpringMVC中的复选框选择与传值
一.checkbox选择 在jQuery中,选中checkbox通用的两种方式: $("#cb1").attr("checked","checked& ...
- jQuery实现checkbox(复选框)选中、全选反选代码
谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...
- jquery处理checkbox(复选框)是否被选中
现在如果一个复选框被选中,是用checked=true,checked="checked"也行 要用prop代替attr会更好,虽然在jQuery1.6之前版本的attr()方法能 ...
- JQuery、js判断复选框是否选中状态
JQuery: var $isChecked = $("#id").is(":checked"); alert($isChecked); JS: var $id ...
- jQuery 获取 多个 复选框 和 javascript 对比
$('input[name="teams"]:checked').size() // 全选 $("#quanteam").bind("click&qu ...
- jquery、js判断复选框是否选中
js: if (document.getElementById("checkboxID").checked) { alert("checkobx is checked&q ...
随机推荐
- [51nod1310]Chandrima and XOR
有这样一个小到大排列的无穷序列S:1, 2, 4, 5, 8......,其中任何一个数转为2进制不包括2个连续的1.给出一个长度为N的正整数数组A,A1, A2......An记录的是下标(下标从1 ...
- 重新学习一次javascript;
每次有项目的时候,总觉得自己什么都不会做,然后做的时候又很简单,一会就做完了,啪啪打脸: 每次别人问的时候,我知道怎么做,但是不知道具体原理,觉得瞬间low了: 想要好好的吧基础掌握一下: 这几天空闲 ...
- js onclick传递 对象
在html onclick中如果参数直接传递一个参数js会报错. 如果想要onclick传递参数需要这么做: var user = {id:1, name:'hk'}; var ele = '< ...
- Android Studio解决导入项目非常慢的问题
http://www.androidchina.net/5527.html Android Studio比Eclipse ADT有巨大的优势. Android Studio原生支持使用Gradle来构 ...
- 【转自知乎】:localhost、127.0.0.1 和 本机IP 三者的区别?
作者:知乎用户链接:https://www.zhihu.com/question/23940717/answer/26230963来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...
- web框架前言与学生数据库系统(附1.0源码)
对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端. import socket def f1(request): ""&quo ...
- c++---天梯赛---N个数求和
★题目: ★难点:要求只能以有理数和分数去输出结果. ★分析:可以对输入的数据进行通分处理,随后把结果按格式输出. ★代码: #include<iostream> #include< ...
- 什么是WEBserver? 经常使用的WEBserver有哪些?
地址:http://www.mamicode.com/ 什么是WEBserver? 经常使用的WEBserver有哪些? 一.什么是WEBserver Webserver能够解析HTTP协议.当Web ...
- dedecms的include文件夹是干什么的?
include是DEDECMS的系统文件夹,里面放的是DEDECMS系统下的一些系统功能函数文件和功能定义与说明以及参数的文件. include目录文件作用解析 arc.archives.class ...
- gRPC实战
gRPC是Google开源的一款非常棒的系统间通信工具,完美的communication抽象,构建在protobuf之上的RPC. 下面我们聊聊它的应用场景,grpc为分布式系统而生,可以是系统间通信 ...