首页 > 其他分享 >js注册全选事件、单选全部后“全选”勾选事件

js注册全选事件、单选全部后“全选”勾选事件

时间:2023-05-08 09:04:05浏览次数:46  
标签:checked ckboxs items js 全选 单选 var false

   //注册全选事件
                        $("#selectAll").click(function () {
                            var isAllCheck = $("#selectAll").prop("checked");
                            var items = document.getElementsByName("ckbx");
                            if (isAllCheck) { //全选
                                for (var i = 0; i < items.length; i++) {
                                    $(items[i]).prop('checked', true);
                                }
                            } else { //取消全选
                                for (var i = 0; i < items.length; i++) {
                                    $(items[i]).prop('checked', false);
                                }
                            }
                        }); 
                        //注册单个选中事件,全选了“全选”按钮也勾上,否则“全选”按钮去掉勾选
                        var ckboxs = document.getElementsByName("ckbx");
                        for (let i = 0; i < ckboxs.length; i++) {
                            ckboxs[i].onclick = function () {
                                //默认都勾取
                                let flag = true;
                                for (j = 0; j < ckboxs.length; j++) {
                                    if (ckboxs[j].checked == false) {
                                        //如果checked如果有一个没选上就是false
                                        flag = false;
                                    }
                                }
                                selectAll.checked = flag;
                            }
                        }

 

标签:checked,ckboxs,items,js,全选,单选,var,false
From: https://www.cnblogs.com/privateLogs/p/17380622.html

相关文章

  • js基础---set、math、date等类
    set类概念,需要new功能为创建一个集合,与数组类似,区别就是它不能设置重复的值math是一个工具类,不需要new,可直接使用它的方法。他的常用方法如下:date类,需要newgetTime():返回一个时间戳,单位为毫秒。......
  • 巧用Chrome格式化压缩后的js文件
    对于格式化的js文件,可以用chrome处理。打开chrome浏览器,按F12进入开发者工具界面,找到一个压缩js文件,如图: 在浏览器的底部(左边)的工具栏有一个"{}"样的图标 ,点击一下就可以了。 格式后: 格式化的js也可以左击保存:......
  • Json数据的序列化与反序列化的三种常用方法介绍
    以下内容是本作者从官网中看相应的教程后所做的demo,其体现了作者对相关知识点的个人理解。。作者才疏学浅,难免会有理解不到位的地方。。还请各位读者批判性对待。。。    本文主要介绍在Json数据的序列化与反序列化的过程中我经常用到的三种工具的基本使用方法,及其他们之间......
  • Vue.js:Vue-Router动态路由从服务器接口获取路由数据
    (目录)文档https://v3.router.vuejs.org/zh/installation.html版本号"vue":"2.6.10","vue-router":"3.6.5",有几种方式实现动态路由:前端配置完整路由,通过接口返回的数据判断是否可显示,是否可访问前端配置部分路由,由后端接口返回的数据生成新路由抛开路由的思维,是否......
  • JS逆向 -- 某平台登录算法分析(RSA加密)
    一、输入账号密码,进行抓包二、F12打开开发者工具,抓包分析,password被加密了三、全局搜索password关键字,挨个分析,在箭头标记处找到了关键代码四、局部搜索,定位加密的关键点,通过JSEncrypt,setPublicKey等关键字分析是RSA加密五、代码编写1、调用RSA加密的基本代码编写functionaiyou(pw......
  • js基础---对象的序列化(JSON)与map
    序列化概念json工具类就是那个转换字符串的方法调用json静态方法,不需要new。注意事项将对象转换为json后再转换为对象,相当于做了一次深复制。当对象的字符串key属性满足不了需求时,可用map的对象属性作为keymap属性和方法map与数组之间的转换......
  • 使用 @ResponseBody 注解直接返回json字符串结果中文出现乱码
    在类上直接使用@RestController,这样子,里面所有的方法都只会返回json字符串了,不用再每一个都添加@ResponseBody!我们在前后端分离开发中,一般都使用@RestController,十分便捷!@RestControllerpublicclassUserController{//produces:指定响应体返回类型和编码@Request......
  • URL查询字符串与JS对象互转
    formatUrlQuery:function(...urlQuerys){letresult={};urlQuerys.forEach((urlQuery)=>{if(typeofurlQuery=='object'){Object.assign(result,urlQuery);}else{Object.assign(result,se......
  • 在web中使用json json异常
    今天在web中使用Jacjson将后端对象转换为json类型传输,在pom中导入依赖,代码中也可以引用,启动tomcat后发现启动失败,报jackson的异常。以为是jacson和spring的版本冲突问题,换版本,也是不能启动。换了fastjson后在代码中导入包,发现不能正常弹出方法引用,突然发觉,可能是tomcat的lib目录没......
  • IDEA 设置JSP启动页面/默认页面
    一图解千惑在项目中WEB-INF中的web.xml文件中配置项目的默认启动页面。web.xml 是个XML格式的文件<?xmlversion="1.0"encoding="UTF-8"?><web-appxmlns="http://xmlns.jcp.org/xml/ns/javaee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance&......