JavaScript CheckBox实现全选和部分选择
<html>
<head>
<script>
function BatchAddToBasket() {
var questionNums = '';
var checkboxs = document.getElementsByName('question');
for (var i = 0; i < checkboxs.length; i++) {
var isChecked = false;
if (checkboxs[i].checked) {
isChecked = true;
break;
}
}
if (!isChecked) {
alert('请至少选择一个选项');
return;
} for (var i = 0; i < checkboxs.length; i++) {
if (checkboxs[i].checked) {
questionNums += checkboxs[i].id;
if (i < checkboxs.length - 1)
questionNums += ',';
}
}
alert('选项id：' + questionNums);
} function SelectAll(obj) {
if (obj.checked) {
var checkboxs = document.getElementsByName('question');
for (var i = 0; i < checkboxs.length; i++) {
checkboxs[i].checked = true;
}
} else {
var checkboxs = document.getElementsByName('question');
for (var i = 0; i < checkboxs.length; i++) {
checkboxs[i].checked = false;
}
}
}
</script>
</head>
<body>
<div>
<input type="checkbox" name="checkboxAll" onclick="SelectAll(this)">
<button onclick="BatchAddToBasket()">加入试题篮</button>
</div>
<div>
<input type="checkbox" name="question" id=0>
<input type="checkbox" name="question" id=1>
<input type="checkbox" name="question" id=2>
</div>
</body>
</html>
JavaScript CheckBox实现全选和部分选择的更多相关文章
- html javascript checkbox实现全选功能
html代码 <input type="checkbox" id="all" />all</input> <input type= ...
- JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择
//点击全选button的事件操作 function selectAll(){ var allcheckBoxs=document.getElementsByName("iTo") ...
- js之全选即点击全选标签可选择全部复选框
目标效果:网页全选功能,即点击全选标签可选择全部复选框 实现代码如下 <!DOCTYPE html> <html lang="en"> <head&g ...
- jquery checkbox 选中 全选 插件
checkbox 选中 全选 在项目中经常用到,但是不同的程序员写出的东西各有差异,在此整合了jquery checkbox插件,用起来很方便,也总结了我们项目中通常会出现问题的地方,一行代码搞定. ...
- react实现全选、取消全选和个别选择
react里面实现全选和取消全选,个别选择等操作,效果如下 代码: import React, {Component} from 'react' export default class Demo e ...
- html checkbox 实现全选/取消全选
html checkbox 实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...
- jquery中checkbox的全选与反选
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title> ...
- 让DuiLib CheckBox支持全选、全不选、非全选三种状态
原文 https://blog.csdn.net/EveyX/article/details/38433783 DuiLib官方库中的Checkbox只有Checked和Uncheck两种状态,但我们 ...
- jQuery checkbox的全选与反选
1:checkbox的全选与反选 js 代码 $("#cbAll").click(function(){ if($("#cbAll").is(":ch ...
随机推荐
- bat显示多行文字，逐个显示哦！不同的颜色！
最近想修改bat文件输出提示的时候能有不同的颜色提示,在网上找了下,发现这个文章,实现的不错,先记录下来,留着后面研究. 这是曾经写的,又稍微改进了一下. @echo off set str=青天有月 ...
- 基于SSL的WCF传输安全
[实践]WCF传输安全1:前期准备之证书制作 [实践]WCF传输安全2:基于SSL的WCF匿名客户端 [实践]WCF传输安全3:基于SSL的WCF对客户端验证 [实践]WCF传输安全4:基 ...
- 关于postman、postman interceptor的安装、配置问题
由于app中有一些鉴权问题,需要携带浏览器的cookie. 不然的话不能够正确测试接口,就在chrome(这里下载的来源是Google商店)中添加了postman interceptor插件. 然后发 ...
- CSS动画复习
一.css动画相关的几个属性 属性 含义 理解 transform 一种CSS属性.用于修改CSS视觉格式模型的坐标空间.使用它,元素可以被移动(translate).旋转(rotate).缩放(sc ...
- HDU4825(字典树+贪心)
Xor Sum Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 132768/132768 K (Java/Others)Total S ...
- [转载]Linux内核list_head学习（二）
前一篇文章讨论了list_head 结构的基本结构和实现原理,本文主要介绍一下实例代码. 自己如果想在应用程序中使用list_head 的相应操作(当然应该没人使用了,C++ STL提供了list 用 ...
- Linux测试程序 - 多线程
#include <sched.h> #include <pthread.h> main(){ pthread_t id0, id1, id2; ret=pthread_cre ...
- 侯捷STL学习(三)--分配器测试
第七节:分配器测试 标准的分配器Allocator,#include<ext/...>都是拓展的 可以用不同的分配器测试同一容器 分配器allocate() & deallocat ...
- VMware：Configuration file was created by a VMware product with more features than this version
Few days ago,I opened the Genesys demo VM by VMware Server 1.0.4 and got an error like this: "C ...
- 10-14C#基础--语句（switch....case和for...循环）
10-14C#基础--语句(2) 一.课前作业:“跟电脑猜拳” 二.switch(定义的变量,参数值)......case.... 注:switch...case大多用于值类型的判断,这里不同于if表 ...