JavaScript反选

浅浅的花香味﹌ 2022-06-06 09:36 34阅读 0赞

**//应用外置的JS**

function test7()\{  
var status = document.getElementsByClassName("all")\[0\].checked;  
 var strs = document.getElementsByClassName('str');  
for(i in strs)\{  
strs\[i\].checked = status;  
\}  
\}

function test8()\{

var status = document.getElementsByClassName("all")\[0\].checked;

var strs = document.getElementsByClassName('str');  
for(var i=0;i<=strs.length-1;i++)\{  
if (strs\[i\].checked == true) \{ // checked属性，true false  
strs\[i\].checked=false;  
\}else\{  
strs\[i\].checked=true;  
\}  
\}

\}

<table>  
<thead>  
<th><input type="checkbox" class="all" οnchange="test7()"></th>  
  
<th>姓名</th>  
<th>专业</th>  
<th>学号</th>  
</thead>  
<tbody>  
<tr>  
<td><input type="checkbox" class="str"></td>  
<td>张三</td>  
<td>会计</td>  
<td>2017001</td>  
</tr>  
<tr>  
<td><input type="checkbox" class="str"></td>  
<td>李四</td>  
<td>会计</td>  
<td>2017002</td>  
</tr>  
<tr>  
<td><input type="checkbox" class="str"></td>  
<td>王五</td>  
<td>数学</td>  
<td>2017003</td>  
</tr>  
<tr>  
<td><input type="checkbox" class="str"></td>  
<td>赵明</td>  
<td>物理</td>  
<td>2017004</td>  
</tr>  
</tbody>  
</table>  
  
  
<input type="button" value="反选" οnclick="test8()" />

发表评论取消回复

表情：

评论列表（有 0 条评论，34人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript实现全选、反选功能（Vue全选、反选，js原生全选、反选）

首先为复选框添加了一个事件监听器，当用户点击该复选框时，将触发该事件；然后在事件处理函数中，通过遍历所有复选框，将它们的选中状态设置为与复选框相同的状态。

缺乏、安全感/ 2024年04月22日 22:30/ 0 赞/ 102 阅读

相关用 JS（JavaScript ）实现多选、全选、反选

JS小例题学习内容：需求总结：学习内容：需求用 JavaScript 实现全选、反选、多选实现代码 <!D

╰+哭是因爲堅強的太久メ/ 2023年01月16日 03:29/ 0 赞/ 236 阅读

相关 javascript全选、反选

<!DOCTYPE html> <html> <head> <title>test</title> </head> <body

谁借莪１个温暖的怀抱￠/ 2022年12月29日 00:15/ 0 赞/ 202 阅读

相关 javascript--全选、取消全选、反选

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

快来打我*/ 2022年09月21日 13:26/ 0 赞/ 257 阅读

相关 JavaScript反选

//应用外置的JS function test7()\{ var status = document.getElementsByClassName("all")\[0\]

浅浅的花香味﹌/ 2022年06月06日 09:36/ 0 赞/ 35 阅读

相关 JavaScript简单实现全选反选框

偷个懒~ 样式就不写了，直接上HTML <table> <thead> <tr>

逃离我推掉我的手/ 2022年05月28日 03:42/ 0 赞/ 199 阅读

相关全选反选JavaScript实现

html代码 <label for="all">全选</label><input type="checkbox" id="all"> <div id="box

Myth丶恋晨/ 2022年05月27日 12:36/ 0 赞/ 253 阅读

相关 javascript实现全选，反选功能

今天看项目发现有全选和反选的按钮实现，比较感兴趣，从网上搜索了自己实现了一下实现的方式就是在我们的按钮中设置响应的事件，然后在我们的函数中，通过定义的多选按钮的na

淡淡的烟草味﹌/ 2022年05月17日 10:48/ 0 赞/ 263 阅读

相关 JavaScript复选框（全选/全不选反选）

实例代码： 1 JS代码： <script type="text/javascript"> window.οnlοad=function()\{

一时失言乱红尘/ 2022年05月17日 01:46/ 0 赞/ 298 阅读

相关 JavaScript实现全选、反选、不选功能

实现代码： <!DOCTYPE html> <html> <meta charset='utf-8' /> <body> <input

叁歲伎倆/ 2022年02月15日 08:06/ 0 赞/ 330 阅读