1. 全栈程序员必看首页

JS 怎么控制 checkbox 选中

全栈程序员-站长 • • 未分类 • 阅读 56

JS 怎么控制 checkbox 选中2019独角兽企业重金招聘Python工程师标准>>>…

大家好，又见面了，我是你们的朋友全栈君。

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

<script>
window.onload = function(){

//获取id 为 check 的隐藏域的值（比如“2,5”）
//将name 为 about ，value为2和5的checkbox 设为选中 
}
</script>
以上代码怎么写？

 

思路：获取checkbox对象，根据value属性设置checkbox的checked属性（true为选中，false为取消选中）。下面实例演示——根据文本框的制定值设置复选框的选中项：

1、HTML结构

1

2

3

4

5

6

<input name="test" type="checkbox" value="1" />item-1

<input name="test" type="checkbox" value="2" />item-2

<input name="test" type="checkbox" value="3" />item-3

<input name="test" type="checkbox" value="4" />item-4

<input name="test" type="checkbox" value="5" />item-5

<input type="text" id="val"><input type="button" value="确定" onclick="fun()">

2、javascript代码

1

2

3

4

5

6

7

8

9

10

11

12

function fun(){

    var val = document.getElementById("val").value.split(",");

    var boxes = document.getElementsByName("test");

    for(i=0;i<boxes.length;i++){

        for(j=0;j<val.length;j++){

            if(boxes[i].value == val[j]){

                boxes[i].checked = true;

                break

            }

        }

    }

}

3、效果演示

5bafa40f4bfbfbedb576cc047ef0f736afc31f99.jpg

转载于:https://my.oschina.net/zhangyaxin/blog/1587987

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。

发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/159837.html原文链接：https://javaforall.net

赞 (2)
全栈程序员-站长的头像全栈程序员-站长
0 0


相关推荐

  • 网络python培训班「建议收藏」

    网络python培训班「建议收藏」

    网络python培训班「建议收藏」为进一步推动高等院校人工智能教学工作的开展，加强国内各高等院校同行间的交流，培养国内的师资力量，将人工智能最新实训内容带入课堂，特举办“人工智能系列课程理论与实践”高级培训班。该培训定于2021年7月20日开始，共包含七大专题，每个专题5天左右，共计30天，通过线上直播的方式进行集训。七大专题分别为Python机器学习，图像识别与深度学习，深度学习与NLP，知识图谱、图神经网络和强化学习，深度学习PyTorch理论与实战。本次培训由权威专家主讲，提供实验环境及实验数据，并提供配套资料，通过剖析工程案例展

    全栈程序员-站长的头像 全栈程序员-站长
    2022年7月19日
    17
  • Mysql忘记密码和密码重置

    Mysql忘记密码和密码重置

    Mysql忘记密码和密码重置**Mysql忘记密码和密码重置**环境：系统Windows10MySQL-8.0.23操作步骤：1、停止MySQL服务打开命令窗口cmd，输入命令：netstopmysql，停止MySQL服务2、开启跳过密码验证登录的MySQL服务打开命令窗口cmd，进入mysql安装目录下的bin目录,然后输入如下这条命令`mysqld–shared-memory–skip-grant-tables`3、重新打开一个cmd命令窗口，输入mysql命令就可以直接登录了，直接

    全栈程序员-站长的头像 全栈程序员-站长
    2022年6月17日
    18
  • 深入理解Java虚拟机：垃圾收集

    深入理解Java虚拟机：垃圾收集

    深入理解Java虚拟机：垃圾收集概述    GC即垃圾回收，是指jvm用于释放那些不再使用的对象所占用的内存。    垃圾收集的目的在于清除不再使用的对象。gc通过确定对象是否被活动对象引用来确定是否收集该对象。两种常用的方法是引用计数和对象引用遍历。JVM的GC触发原理    JVM的GC主要是对堆内存的回收，一般把新生代的GC称为minorGC，把老年代的GC成为fullGC，所谓fullgc会先出发一次minor

    全栈程序员-站长的头像 全栈程序员-站长
    2022年5月14日
    30
  • Eclipse中使用SVN教程「建议收藏」

    Eclipse中使用SVN教程「建议收藏」

    Eclipse中使用SVN教程「建议收藏」此文章对Myeclipse同样适用。一.在Eclipse里下载Subclipse插件方法一：从EclipseMarketplace里面下载具体操作：打开Eclipse–>Help–>EclipseMarketplace–>在Find中输入subclipse搜索–>找到subclipse点击install方法二：从InstallNewSoftware里下载具体操作：打

    全栈程序员-站长的头像 全栈程序员-站长
    2022年9月26日
    1
  • vue 路由嵌套_vuejs直接打开第三级路由

    vue 路由嵌套_vuejs直接打开第三级路由

    vue 路由嵌套_vuejs直接打开第三级路由嵌套路由有时候在路由中，主要的部分是相同的，但是下面可能是不同的。比如访问首页，里面有新闻类的/home/news，还有信息类的/home/message。这时候就需要使用到嵌套路由。项目结构如下：

    全栈程序员-站长的头像 全栈程序员-站长
    2022年8月7日
    7
  • 伴随矩阵求逆矩阵(已知A的伴随矩阵求A的逆矩阵)

    伴随矩阵求逆矩阵(已知A的伴随矩阵求A的逆矩阵)

    在之前的文章《线性代数之矩阵》中已经介绍了一些关于矩阵的基本概念，本篇文章主要就求解逆矩阵进行进一步总结。余子式(Minor)我们先看例子来直观的理解什么是余子式(Minor，后边将都用英文Minor，中文的翻译较乱）。minorexample这个例子（我们假设矩阵为A）中我们看到A[1,1]的minor就是将A[1,1]所在的行和列删除后剩下的矩阵的行列式，假设我们把A[…

    全栈程序员-站长的头像 全栈程序员-站长
    2022年4月13日
    148

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号