zoukankan      html  css  js  c++  java
  • js之checkbox 全选 反选 单选

    看了之后,觉得不错,以备使用:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>全选与反选</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script language="javascript"> // --列头全选框被单击--- function ChkAllClick(sonName, cbAllId){ var arrSon = document.getElementsByName(sonName); var cbAll = document.getElementById(cbAllId); var tempState=cbAll.checked; for(i=0;i<arrSon.length;i++) { if(arrSon[i].checked!=tempState) arrSon[i].click(); } } // --子项复选框被单击--- function ChkSonClick(sonName, cbAllId) { var arrSon = document.getElementsByName(sonName); var cbAll = document.getElementById(cbAllId); for(var i=0; i<arrSon.length; i++) { if(!arrSon[i].checked) { cbAll.checked = false; return; } } cbAll.checked = true; } // --反选被单击--- function ChkOppClick(sonName){ var arrSon = document.getElementsByName(sonName); for(i=0;i<arrSon.length;i++) { arrSon[i].click(); } } </script> </head> <body> <form name="form1" method="post" action=""> <table width="600" border="1"> <tr > <td width="10%"> <INPUT name="chkAll" id="chkAll" title="全选" onClick="ChkAllClick('chkSon[]','chkAll')" type="checkbox" />全选</td> <td align="center">复选框全选示例 </td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon1" type="checkbox" value='1' onclick="ChkSonClick('chkSon[]','chkAll')" />1</td> <td> 作用: </td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon2" type="checkbox" value='2' onclick="ChkSonClick('chkSon[]','chkAll')" />2</td> <td> a.单击列头复选框全选或全不选子项 </td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon3" type="checkbox" value='3' onclick="ChkSonClick('chkSon[]','chkAll')" />3</td> <td> b.只要有一个子项没有选中,则取消列头的选中状态 </td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon4" type="checkbox" value='4'  onclick="ChkSonClick('chkSon[]','chkAll')" />4</td> <td> c.当所有子项目选中时,列头复选框自动置为选中状态 </td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon5" type="checkbox" value='5' onclick="ChkSonClick('chkSon[]','chkAll')" />5</td> <td>d.将复选框反过来选</td> </tr> <tr> <td><INPUT name="chkSon[]" id="chkSon6" type="checkbox" value='6' onclick="ChkSonClick('chkSon[]','chkAll')" />6</td> <td>F:注意input的name写为chkSon[],在提交的POST中复选的value值都在一个数组中, 然后可以使用各种方法实现批量删除。</td> </tr> <tr> <td><INPUT name="chkOpposite" id="chkOpposite" title="反选" onClick="ChkOppClick('chkSon')" type="checkbox" />反选</td> <td align="center">反选示例</td> </tr> </table> </form> </body> </html>
  • 相关阅读:
    为Android系统内置Java应用程序测试Application Frameworks层的硬件服务
    为Android系统的Application Frameworks层增加硬件访问服务
    为Android硬件抽象层(HAL)模块编写JNI方法提供Java访问硬件服务接口
    为Android增加硬件抽象层(HAL)模块访问Linux内核驱动程序
    为Android系统内置C可执行程序测试Linux内核驱动程序
    Android内核驱动程序的编写和编译过程
    添加一个Application Framework Service
    getopt()函数
    Google推Android新开发语言Sky:流畅度 秒iOS
    开发人员要避免的七个心态问题
  • 原文地址:https://www.cnblogs.com/xiongsd/p/3009321.html
Copyright © 2011-2022 走看看