js 全选和反选

最新推荐文章于 2022-04-05 10:42:46 发布
最新推荐文章于 2022-04-05 10:42:46 发布
阅读量91 收藏
点赞数
文章标签： HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/heidoutwenty/article/details/83851160
版权

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  <title>Untitled Document</title>
 </head>
 <script>
  //全选
  function selectAll(){
   //首先判断checkbox是否选中
   var checkbox = document.getElementById("checkbox");
   var checkbox1 = document.getElementsByName("checkbox1");
   //如果checkbox选中，checkbox1数组选中
   //如果checkbox不选中，checkbox1数组不选中
   if(checkbox.checked == true){
    for(var i=0; i<checkbox1.length; i++){
     checkbox1[i].checked = true;
    }
   }else{
    for(var i=0; i<checkbox1.length; i++){
     checkbox1[i].checked = false;
    }
   }
  }
  //反选
  function selectOpposite(){
   //首先判断checkbox是否选中
   var checkbox = document.getElementById("checkbox");
   var checkbox1 = document.getElementsByName("checkbox1");
   for(var i=0; i<checkbox1.length; i++){
    checkbox1[i].checked = !checkbox1[i].checked;
   }
  }
 </script>
 <body>
  <table border="1">
   <tr>
    <td>
     全选<input type="checkbox" id="checkbox" name="checkbox" value="0" >
     反选<input type="checkbox" id="checkbox" name="checkbox" value="0" >
    </td>
    <td>
     请写入
    </td>
   </tr>
   <tr>
    <td>
     <input type="checkbox" id="checkbox1" name="checkbox1" value="0">
    </td>
    <td>
     <input type="text" id="txt1" name="txt1" value="">
    </td>
   </tr>
   <tr>
    <td>
     <input type="checkbox" id="checkbox1" name="checkbox1" value="1">
    </td>
    <td>
     <input type="text" id="txt2" name="txt2" value="">
    </td>
   </tr>
   <tr>
    <td>
     <input type="checkbox" id="checkbox1" name="checkbox1" value="2">
    </td>
    <td>
     <input type="text" id="txt3" name="txt3" value="">
    </td>
   </tr>
  </table>
 </body>
</html>

heidoutwenty
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js实现全选和反选功能
10-25
js实现全选和反选功能 js实现全选和反选功能 js实现全选和反选功能 js实现全选和反选功能 js实现全选和反选功能
js全选和反选
hjy170314的博客
03-18 95
全选和反选 &lt;script&gt; var navBar_list = document.getElementById('title'); navBar_list.onclick = function(){ var navBar_list_item = document.getElementsByName('item'); for(...
js中全选与反选
m0_58451019的博客
04-05 166
window.onload = function (){ document.getElementById("all_select").onclick = function (){ var Hobby = document.getElementsByName("hobby"); for(i = 0; i < Hobby.length; i++){ Hobby[i].checked = this.value; } .
vue2.0在table中实现全选和反选的示例代码
08-28
在 `home.vue` 文件中，我们可以看到使用 JavaScript 实现全选和反选的逻辑，并使用 `v-on` 指令来绑定事件。 本示例代码展示了 Vue 2.0 中实现 Table 全选和反选的示例代码，并介绍了相关的知识点，包括使用 Vue ...
Jquery 1.42 checkbox 全选和反选代码
10-29
接着，定义了一个名为`Checked`的JavaScript函数，这个函数用于实现全选和反选的功能： ```javascript function Checked(){ // 遍历所有class为"chk"的复选框 $(".chk").each(function(){ // 检查复选框的...
javascript实现简单的全选和反选功能
01-19
全选反选</title> </head> <body> <input type=button value=全选 id=all> <input type=button value=反选 id=reverse> <input type=checkbox id=flagCheck>
vue实现简单全选和反选功能
10-14
在Vue.js中，实现全选和反选功能是常见的需求，尤其在表格或者列表展示大量数据时。在给定的代码示例中，通过使用Vue的`v-model`和`computed`属性，我们可以轻松地实现这个功能。下面将详细解释这个实现过程。 首先...
JS实现checkbox的全选和反选
07-22
资源名称：JS实现checkbox的全选和反选资源截图： 资源太大，传百度网盘了，链接在附件中，有需要的同学自取。
js之全选和反选
weixin_43978453的博客
04-29 1493
全选和反选操作是js中常见的操作，在许多网站常常可以见到。因此，掌握好全选和反选操作的代码书写十分重要。
js 的全选和反选
李丽娟
01-22 490
function checkAll(name){     //alert("aa");     var el=document.getElementsByName("checkbox[]")     var len=el.length;     //alert(len);     for(var i=0;i     {         if((el[i].type=="checkbo
JQuery 遍历&attr&prop的使用
岁月如歌
07-28 749
JQuery 遍历&attr&prop的使用1、for循环：2、attr & removeAttr3、prop 1、for循环： 2、attr & removeAttr Html代码： <head> <meta charset="UTF-8"> <title>Title</title> &lt...
用js实现全选和反选
yangaoyuan1999的博客
10-30 565
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <button class="Select">全选</button&...
js实现全选与反选
nervelin的博客
07-04 522
源码如下： js: <script> var all = document.getElementById('j_cbAll'); var checks = document.getElementById('j_tb').getElementsByTagName('input'); //伪数组 //全选、取消全选 all.onclick = function() { // console.log(t..
JavaScript的全选与反选
qq_26925297的博客
04-11 351
&lt;body&gt;           &lt;table&gt;    &lt;tr&gt;            &lt;td&gt;&lt;input type="checkbox" name="hobby"&gt;&lt;/td&gt;       &lt;td&gt;篮球&lt;/td&gt;    &lt;/tr&a
javascript实现全选与反选
hongtengfei523的博客
09-29 417
//全选/全不选 功能的实现------------------------------------------------------------         function change(){         var inputQXNode = document.getElementsByName("CheckItiems")[0];         var checkNodes
jquery实现全选和反选
最新发布
05-18
可以使用以下代码实现全选和反选的功能： ```javascript // 全选 $("#checkAll").click(function(){ $("input[type='checkbox']").prop("checked", true); }); // 反选 $("#checkReverse").click(function(){ $...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值