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 ...
随机推荐
- BZOJ1116：[POI2008]CLO
浅谈并查集:https://www.cnblogs.com/AKMer/p/10360090.html 题目传送门:https://lydsy.com/JudgeOnline/problem.php? ...
- Ubuntu 16.04安装Elasticsearch，Logstash和Kibana（ELK）Filebeat
https://www.howtoing.com/how-to-install-elasticsearch-logstash-and-kibana-elk-stack-on-ubuntu-16-04 ...
- inotify 同步脚本
#!/bin/bash path1=/home/htoa/tomcat/webapps/ROOT/htoa/ ip=192.168.30.13 /usr/bin/inotifywait -mrq -- ...
- 表有外键所以delete报错了，这里有2种办法处理：
表有外键所以delete报错了,这里有2种办法处理: (1) 临时设置外键失效 (2) 删除表涉及到的外键的表的数据 2.外键失效的处理方案 mysql> SET FOREI ...
- Poj 2488 A Knight's Journey(搜索)
Background The knight is getting bored of seeing the same black and white squares again and again an ...
- Angular5学习笔记 - 配置Http（七）
一.引入Http模块 编辑\src\app\app.module.ts文件 import { HttpModule } from '@angular/http'; /* 注册模块 */ imports ...
- java代码。继承。。。很戳我的心啊。。不太懂。super的真正用法
总结: package com.addd; //构造方法不能被继承,只能是调用 //属性不能被继承,方法可以 //关于继承练习啊 class fjdsk { String name; int age; ...
- codeforce 510C Fox And Names（拓扑排序）
Fox And Names time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...
- javascript一些小的注意点
try...catch 可以测试代码中的错误.try 部分包含需要运行的代码,而 catch 部分包含错误发生时运行的代码. 当try { 里面的代码 出现错误了 }catch(e){ 才执行下面的c ...
- 2015.2.27 UltraEdit中显示XML结构
1选择菜单项 "视图"->"显示方式(着色文件类型)"->"XML": 2选择菜单项 "格式"->&q ...