单选全选框如何实现

简介: 单选全选框如何实现

我在写移动端项目中多次都需要用到单选全选问题,实现方法也是非常简单的!接下来我们就直接上代码把!!!简单易懂大家自己看把。

全选

// 全选
function quanxuan() {
    let quan = document.getElementById("全选名");
    let ge = document.getElementsByClassName("单选名")
    for (let i = 0; i < ge.length; i++) {
        if (quan.checked == false) {
            ge[i].checked = false;
        } else {
            ge[i].checked = true;
        }
    }
}

单选

// 单选
function danxuan() {
    let quan = document.getElementById("全选名");
    let ge = document.getElementsByClassName("单选名")
    for (let i = 0; i < ge.length; i++) {
        if (ge[i].checked == false) {
            quan.checked = false;
            return;
        } else {
            quan.checked = true;
        }
    }
}

代码非常简单的!!!自行研究

目录
相关文章
|
6月前
|
前端开发
复选框样式修改(复选框变为圆形)
复选框样式修改(复选框变为圆形)
|
6月前
|
Web App开发 小程序 Android开发
Uniapp from 表单组件 多层选择 开关 评分 滑块 步进器 日期框 级联选择 下拉列表 复选框 单选框 多行文本 单行文本 textarea radio checkbox picker
Uniapp from 表单组件 多层选择 开关 评分 滑块 步进器 日期框 级联选择 下拉列表 复选框 单选框 多行文本 单行文本 textarea radio checkbox picker
101 0
|
前端开发
uniapp checkbox样式失效,选中框选中按钮不显示
uniapp checkbox样式失效,选中框选中按钮不显示
305 0
|
算法 前端开发
下拉选择框
下拉选择框
98 1
|
JavaScript
原生js实现复选框选全部框与取消全选框
原生js实现复选框选全部框与取消全选框
72 0
|
数据安全/隐私保护
EasyUI–常用控件之按钮/搜索框/密码框/文件框/数字框/日期时间选择框
本篇主要介绍跟后台数据绑定相关度不大的简单控件,直接写了一个详细的例子,需要说明的东西都在注释里面。
611 0
EasyUI–常用控件之按钮/搜索框/密码框/文件框/数字框/日期时间选择框
图片单选多选选择动画
在线演示 本地下载
825 0