jquery 复选框 反选

JQuery 实现复选框全选反选功能   HTML部分 <body> <input type="checkbox" name="fu">全选(父)<br> <input type="checkbox" name="zi">子1<br> <input type="checkbox" name= 阅读详情
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
    *{
        padding:0;margin:0;
    }
</style>
</head>
<body>
    <input type="checkbox" name="WEEK" value="星期一" />星期一
    <input type="checkbox" name="WEEK" value="星期二" />星期二
    <input type="checkbox" name="WEEK" value="星期三" />星期三
    <input type="checkbox" name="WEEK" value="星期四" />星期四
    <input type="checkbox" name="WEEK" value="星期五" />星期五
    <input type="checkbox" name="WEEK" value="星期六" />星期六
    <input type="checkbox" name="WEEK" value="星期日" />星期日
    <br />
    <button class="btn">提示选择的值</button>
    <button class="btn2">全选</button>
    <button class="btn3">选择二日</button>
    <button class="btn4">反选</button>
    <button class="btn5">全不选</button>


 <select name="" id="" onchange="chan(this)">
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
</select> 
</body>
</html>
<script type="text/javascript" src="../jq/js/jquery-1.11.3.js"></script>
<script type="text/javascript">
    function chan(item){
        alert( $(item).val());
     }
    $('.btn').on('click',function(){
        var str = '';
        var $check = $('input[type="checkbox"][name="WEEK"]:checked');
        // console.log($check[1]);
        console.log($check.get(1));
        // console.log($check);
        $.each($check, function(index, item){
            str += item.value + ',';
        });
        alert(str);
    });
    var str = '星期三,星期日,';

    $('.btn2').click(function(){
        $check = $('input[type="checkbox"][name="WEEK"]');
        // $check.each(function(index,item){
        //  $(item).prop('checked',true);
        // });
        $check.prop('checked',true);
    });
    $('.btn3').click(function(){
        var temp = str.split(',');
        var $check = $('input[type="checkbox"][name="WEEK"]');
        $.each(temp,function(key,val){
            $.each($check,function(index,item){
                if($(this).val() == val){
                    $(this).prop('checked', true);
                }
            })
        });

    });
    $('.btn4').click(function(){
        var $check = $('input[type="checkbox"][name="WEEK"]');
        $check.each(function(){
            this.checked = !this.checked;
        })
    });
    $('.btn5').click(function(){
        var $check = $('input[type="checkbox"][name="WEEK"]');
        $check.removeAttr('checked');

    })
</script>
jQuery实现复选框全选反选功能实战案例.zip 本文还有配套的精品资源,点击获取 简介:本案例展示了如何使用jQuery简化JavaScript编程,特别是在处理表格或多选项选择的场景中实现复选框的全选和反选功能。文章首先介绍了复选框在HTML中的基本结构,然后通过jQuery方法如 click() 、 prop() 、 siblings() 、 is(":checked... 阅读详情

相关推荐

从零开始:kohya_ss环境部署与LoRA/SDXL模型训练实战指南

本文提供了一份详细的kohya_ss环境部署与模型训练实战指南。从零开始,手把手教你使用Conda创建虚拟环境、安装依赖并启动Web GUI界面。核心内容涵盖高质量数据集的准备方法,并重点解析了如何使用kohya_ss工具进行LoRA模型和SDXL模型的微调训练,包括关键参数配置与常见报错解决方案,帮助初学者快速上手AI绘画模型定制。

weixin_29162439的博客 536

jquery实现复选框全选、反选

HTML: <input id="all" type="checkbox" value="" /> <label for="all">全选</label> <input id="fan" type="checkbox" value="" /> <label for="fan">反选</label> <button id="getValue">获得所有选中值</button> <ul class="lis

姚家威的博客 3098

OpenRA引擎实战:如何从零开始搭建一个经典RTS游戏模组(附资源包)

本文详细介绍了如何利用开源游戏引擎OpenRA从零开始搭建经典RTS游戏模组。内容涵盖开发环境配置、资源管线处理、YAML规则定义、地图编辑与Lua脚本编写等全流程实战指南,并提供了资源包,帮助开发者和爱好者快速创建属于自己的即时战略游戏世界。

silver的专栏 903

jquery实现全选、反选、获得所有选中的checkbox (记录专用

7个不同的checkbox状态 1、全选 ? 1 2 3 $("#btn1").click(function(){ $("input[name='checkbox']").attr("checked","true"); }) 2、取消全选(全不选) ? 1 2 3

yjq907的博客 916

CYUSB3065配置CMOS

按照OG02B10的时序电路,在通过SCCB配置CMOS之前,需要三个电源上电,Xshutdown高电平和配置时钟电路。找到手册的第6章SCCB(跟IIC很像),可以看到SCCB的地址与SID引脚有关,这个需要到硬件原理图上确认下。这是Cypress的一个支持MIPI和UVC的模块,有例程支持OV5640,现在要替换替换成OG02B10。寄存器参数需要找到厂家的FAE,由他们提供,OG02B10的资料已经上传。(2)参考得宏的电路,时钟由主控提供,目前程序未实现。这里有两个重要参数需要搞定,摄像头的。

qq_40773212的博客 2947

傅里叶光学(1)

傅里叶光学,可以看作是通信理论中傅里叶变换等一系列数学思想以及系统理论与光学(主要是衍射光学)相结合的产物关于傅里叶光学的应用领域,本节介绍了成像,当然事实上不可能仅限于成像,经典的还如激光散斑的一些应用,干涉计量,还有傅里叶变换光谱学等等。最后总结一下,傅里叶光学我认为可以看做一个工具,对于任意的系统,它能给出一些数学思想与物理原理进行解释和分析,找出系统的扰动和响应的关系,或者说根据扰动和响应,来研究或者设计一个系统。

m0_53607446的博客 1671

jquery实现全选、反选、取消全部等操作(复选框checkbox)

this.checked){//一旦有一个未选中,则全选按钮 设置不选中。//将全选框的checked属性设置为false,也就是不选中全选框。//当前控件是选中的则设置为不选中,当前控件未选中的则设置为选中。$(this).parent().parent()是祖父节点tr。//选择class="userid"的控件,设置全部都不选中。//选择class="userid"的控件,让全部都选中。//选择class="userid"的控件,并执行循环。//选择class="userid"的控件。

m0_61549984的博客 2599

【论文复现】——基于LM优化的NDT点云配准算法

传统的正态分布变换配准算法处理初始位姿变换相差较大的两帧点云时,存在无法收敛或者陷入局部最小值的问题。为了提高算法的收敛性能,提出了一种基于LM方法改进的三维正态分布变换配准算法。

点云侠的博客 1163

jQuery-全选/全部选/反选

input type="checkbox" name="items" value="羽毛球" />羽毛球。<input type="checkbox" name="items" value="乒乓球" />乒乓球。<input type="checkbox" name="items" value="足球" />足球。<input type="checkbox" name="items" value="篮球" />篮球。//全选/全部选复选框的状态也变成选中状态。//所有复选框的状态都变成选中状态。

heliuerya的博客 1759

【IoT】 产品设计之结构设计:如何设计产品按键

1、硅胶按键功能实现有两种接触方式 1)硅胶按键按压在DOME片(锅仔片)上 通常用在手机、儿童手表手机、防水手机等防水设备上。 2)硅胶按键增加导电基,一种黑色的导电碳粒,实现回路导电 通常用在遥控器、电脑键盘、特殊设备上。 两种方式结构设计原理是一样的,按键的固定与配合间隙与行程要确保好。 2、硅胶遥控器按键的结构方式(导电基) 按键帽为大颗粒实心的,触点为黑色导电基,通过压注成型融合为一体,那么这种按键结构设计时需要注意那些呢? 最主要的是按键按压回弹的手感,由于没有DOME片实现

产品线负责人 8668

STM32F103标准库开发:Keil5新建STM32工程

新建STM32工程 步骤一:创建工程模板文件 新建一个文件夹 template 在文件夹template里面新建五个文件 (1)CMSIS: 存放内核驱动程序和启动引导文件 (2)FWLIB:存放库函数文件 (3)Project:存放工程文件 (4)System:存放自己写的驱动程序 (5)User:存放用户程序(主函数) 步骤二:导入stm...

MQ0522的博客 2万+

jQuery实现checkbox反选(转载)

//反选 $("#btnInvert").click(function(){ //1.方法一实现反选 $("#chkinput:checkbox").each(function(){ this.checked=!th...

weixin_34191734的博客 158

DRM遇到的实际问题及领悟(3)

DRM遇到的实际问题及领悟(3)

phmatthaus的专栏 636

jQuery实现复选框全选反选

jQuery实现全选反选 html代码 <body> <input type="checkbox" /> <input type="button" value="全选中" /> <input type="button" value="全不选" /> <input type="button" value="反选" /> <input type="button" value="输出选中项" /> <hr /&g

Alfred_tfk的博客 927

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面,电脑运行连游戏界面都一样大小,很怀旧,很真实,(英文版)强烈推荐,很小的文件,很难才找到的。

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

使用jQuery实现复选框的全选、反选和不选

使用jQuery实现复选框的全选、反选和不选 通过给按钮绑定点击事件来控制 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="../js/jquery-1.11.3.js"></script> </he

weixin_44409290的博客 549

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

jquery实现复选框全选,反选,全不选等功能

jquery 实现全选,反选,全不选等功能,下面直接以例子进行说明。设页面有如下一组复选框和几个相关按钮(全选,反选,全不选等): input type="checkbox" name="fruit" value="apple" />苹果 input type="checkbox" name="fruit" value="orange" />橘子 input type="checkbox" na

相信一切皆有可能 3215

JQuery实现复选框CheckBox的全选、反选、提交操作

对复选框最基本的应用,就是对复选框进行全选、反选和提交等操作。复杂的操作需要与选项挂钩,来达到各种级联反应效果。 【示例】使用Jquery实现复选框CheckBox的全选、反选、提交操作。 (1)创建页面,创建一个表格在表格的第一列中放入一组复选框,并实现复选框的全选、反选、提交操作。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>

pan_junbiao的博客 2626

jQuery实现复选框全选,全不选,反选功能

index.jsp <%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %> <!DOCTYPE html> <html> <head> <title>Title</title> <script type="text/javascript" src="JS/jquery-3.6.0.min.js"></script&g

weixin_48747169的博客 2553

jquery实现复选框的全选与反选

jquery实现复选框的全选与反选 复选框的全选和反选功能,是页面中常常会用到的功能,你是否可以很轻松地实现呢?下面是用jquery语法实现的这个实用的小功能。                                    UntitledDocument                                               

xiaobozhu的博客 877

jQuery对复选框的全选,全不选,反选等的操作

资源名称 全选      反选   $(function(){ //全选 $("#all").click(function(){ //将下面所有组件全

mine_song的博客 611

jQuery实现复选框全选、全不选、反选问题解析

  今天打算用jQuery实现一下复选框的全选、全不选和反选问题,刚开始用的是attr("checked",true/false)方法,发现只能在最开始实现一次全选,可以实现全不选,无法实现反选,总之调试了好久死活得不到想要的效果。最后发现,jquery 1.7.2之前支持attr对固有属性的操作,后面的版本只能用prop了。详细了解jQuery中attr()和prop()的区别,请点击...

产品老A,8年互联网大厂AIPM,专注探索新型人机交互 267

jQuery实现复选框全选反选问题

主要方式是通过选择器选定对象,然后进行对应属性的更改 全选: //全选 //通过选择器选定name=item的复选框,并设置其属性checked为true function checkAll(e){ $("input[name='item']").attr("checked","true"); } //文本就绪事件 $(document).ready(function(){ //如果复选框改...

weixin_44215175的博客 296

JQuery 实现复选框的全选、反选、全不选

添加多个复选框 ,三个按钮, 再用JQuery为其添加单击事件&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt; &lt;script src="Scripts/jquery-1

刘远的编程技术博客 2464

【JQuery 实现 layui 复选框 全选/反选/清除的功能】

获取到渲染过的 div class=“layui-input-block” 里的 input 元素标签,改变其 checked属性。

离离火的博客 1337

jQuery 复选框全选/取消全选/反选

jQuery实现的复选框全选/取消全选/反选及获得选择的值。 完整代码: <!DOCTYPE html> <html> <head> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script> <script type...

aijiagui7454的博客 258

JQuery实现列表中复选框全选反选功能

我们在做列表的时候经常会遇到全选,反选进行批量处理问题,例如: 联动选择: $(':checkbox[data-check-target]').click(function () { var target = $(this).attr('data-check-target'); $(target).prop('checked', $(this).prop('checked')); }); 获取复选值: var id_array=new Array(); $('in..

耐小裳的博客 469
上一篇: jquery validate 身份证验证(可以为空)
下一篇: 简单的轮播公示
han_hanker
博客等级 码龄13年 35粉丝 106原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值