复选框(checkox)全选、全不选、反选、获得选中项值的用例
HTML部分:
<div class="all"> <ul> <li><input type="checkbox" value="图书" /><sapn>图书</sapn></li> <li><input type="checkbox" value="动漫" /><sapn>动漫</sapn></li> <li><input type="checkbox" value="电影" /><sapn>电影</sapn></li> <li><input type="checkbox" value="小说" /><sapn>小说</sapn></li> <li><input type="checkbox" value="音乐" /><sapn>音乐</sapn></li> <li><input type="checkbox" value="游戏" /><sapn>游戏</sapn></li> <li><input type="checkbox" value="论坛" /><sapn>论坛</sapn></li> <li><input type="checkbox" value="运动" /><sapn>运动</sapn></li> </ul> <form action=""> <input type="checkbox" value="全选"> <input type="button" value="全选"> <input type="button" value="全不选"> <input type="button" value="反选"> <input type="button" value="获得选中项的值"> </form></div> JS部分://全选var num = 0;$(".all form input[value='全选']").click(function(){ num++; if(num%2==0){ $(".all input[type='checkbox']").each(function(){ $(this).prop("checked",false); }) }else{ $(".all input[type='checkbox']").each(function(){ $(this).prop("checked",true); }) }});
//全不选$(".all form input[value='全不选']").click(function(){ $(".all input[type='checkbox']").each(function(){ $(this).attr("checked",false); })});//反选$(".all form input[value='反选']").click(function(){ if ($(".all form input[value='全选']").is(":checked")== true){ $(".all input[type=checkbox]").prop("checked",false); }else{ $(".all input[type=checkbox]").prop("checked",true); }});//获得选中项的值$(".all form input[value='获得选中项的值']").click(function(){ var vals = []; $(".all li input[type='checkbox']:checked").each(function(i,ele){ vals.push($(this).val()); }); alert(vals);})
复选框(checkox)全选、全不选、反选、获得选中项值的用例的更多相关文章
- 复选框(checkbox)、多选框
1.需求分析 可同时选中多个选项,实现全选.全不选.反选等功能. 2.技术分析 基础的HTML.CSS.JavaScript. 3.详细分析 3.1 HTML部分 图示是一个列表加底部一段文字说明,列 ...
- Flutter学习(8)——CheckBox多选框使用及动态更改多选框数据
原文地址:Flutter学习(8)--CheckBox多选框使用及动态更改多选框数据 | Stars-One的杂货小窝 最近项目需求需要调整页面,记录一下实现过程 这次主要是要实现个评价页面,选择不同 ...
- jQuery对复选框(checkbox)的全选,全不选,反选等的操作
效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...
- 选中没有选中的复选框,匹配含有某个字符串的正则,json取值的两种方法,把变量定义在外面跟里面的区别
一.筛选没有选中的复选框:not("input:checked") 二.匹配有VARCHAR的字符串:".*VARCHAR.*?" 三.json取值的两种方法 ...
- 组合框里添加复选框的方法(使用勾选的假象,用图片代替而已,并非QT原生支持)
组合框可以看作是列表框和文本框的组合,因其占据的空间少,使用操作方便,常被界面设计人员用于界面开发设计中,在有限个输入的条件下,组合框常用来代替文本框,这样从用户使用角度来看,更趋人性化,所见即所得. ...
- Jquery 1.8全选反选删除选中项实现
JQuery1.6以后,Prop的出现,让1.6以下的全选反选效果全部失效了.以下是修正后的版本: 全选反选效果: $(".checkbox").click(function () ...
- ASP.NET MVC中使用MvcPager异步分页+在分页中复选框下一页上一页也保持选中
ASP.NET MVC 分页使用的是作者杨涛的MvcPager分页控件 地址:http://www.webdiyer.com/mvcpager/demos/ajaxpaging/ 这个分页控件在里面 ...
- 复选框回显、全选、非全选、cookie处理数据、json数组对象转换处理学习笔记参考的页面
<%@include file="/common/head.jsp"%> <%@ page contentType="text/html; charse ...
- checkbox 多选框 :jquery之全选、全不选、反选
javascriptjqueryselectAll [html] view plaincopy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...
随机推荐
- C#设计模式系列:桥接模式(Bridge)
1.桥接模式简介 1.1>.定义 当一个抽象可能有多个实现时,通常用继承来进行协调.抽象类定义对该抽象的接口,而具体的子类则用不同的方式加以实现.继承机制将抽象部分与它的实现部分固定在一起,使得 ...
- ASP.NET:注销功能实现
原理:清空Session 1.Web窗体:index.aspx <a href="logoutHandler.ashx">注销</a> 2.一般处理程序:L ...
- 使用Spire组件抛出异常The type initializer for 'spr857' threw an exception
使用Spire组件抛出异常The type initializer for 'spr857' threw an exception 我使用免费的Spire.Xls组件尝试去转换Excel文档到PDF文 ...
- js 对cookie 的操作
<!DOCTYPE html> <html> <head> <script> function setCookie(cname,cvalue,exday ...
- hibernate笔记--基于外键的单(双)向的一对一映射关系
假设我们有两张表,人员信息表Person,和身份信息表IdCard,我们知道每个人只有一个身份证号,所以这里的Person和IdCard表是一一对应的,也就是一对一的映射关系,基于外键的单向一对一映射 ...
- 软件工程-构建之法 理解C#一小段程序
一.前言 老师给出的要求: 阅读下面程序,请回答如下问题: 问题1:这个程序要找的是符合什么条件的数? 问题2:这样的数存在么?符合这一条件的最小的数是什么? 问题3:在电脑上运行这一程序,你估计多长 ...
- 一台电脑上的git同时使用两个github账户
需求: 公司有github账号,自己有github账号,想在git上同时使用,两者互不干扰. 思路: 管理两个SHH key. 解决方案: 一.生成两个SSH key 为了举例方便,这里使用“one” ...
- RabbitMQ原理与相关操作(二)
接着 上篇随笔 增加几个概念: RabbitMQ是一个在AMQP(高级消息队列协议)标准基础上完整的,可服用的企业消息系统. AMQP模型的功能组件图(上图摘自 Sophia_tj 的 第2章 AMQ ...
- 【十大经典数据挖掘算法】C4.5
[十大经典数据挖掘算法]系列 C4.5 K-Means SVM Apriori EM PageRank AdaBoost kNN Naïve Bayes CART 1. 决策树模型与学习 决策树(de ...
- ASP.NET MVC 使用 FluentScheduler 定时器计划任务
MacBook Pro 只有四个 USB Type-C 接口是否错了? 一项新技术的诞生总会对已存在的事物造成冲击或影响,如果大家都害怕冲击与影响,那这个世界永远像现在不变就行了,大家都好好的,待在自 ...