javascript--第12节-全选、取消全选、反选
2016-06-22 15:24
661 查看
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选、取消多选、反选</title> <style type="text/css"> ul{ list-style-type: none; } a{ text-decoration: none; color: #999999; font-weight: bold; } </style> </head> <body> <ul> <li><input type="checkbox" name="ids[]" value="1">香蕉</li> <li><input type="checkbox" name="ids[]" value="2">苹果</li> <li><input type="checkbox" name="ids[]" value="3">西瓜</li> <li><input type="checkbox" name="ids[]" value="4">梨</li> <li><input type="checkbox" name="ids[]" value="5">草莓</li> <li><input type="checkbox" name="ids[]" value="6">葡萄</li> </ul> <a href="javascript:selectAll();">全选</a> <a href="javascript:selectNull();">取消全选</a> <a href="javascript:selectRev();">反选</a> <script> var all=document.getElementsByTagName("input"); function selectAll(){ for(var n=0;n<all.length;n++){ all[n].checked="true";//全选为checked=1的时候为1或者true } } function selectNull(){ for(var n=0;n<all.length;n++){ all[n].checked="";//取消全选的,checked为空 } } function selectRev(){ for(var n=0;n<all.length;n++){ if(all[n].checked){ all[n].checked=""; }else { all[n].checked="true"; } } } </script> </body> </html>
相关文章推荐
- ajax&json
- javascript--第12节-javascript表单处理
- javascript--贪食蛇(完整版-逻辑思路)
- JS 操作 file标签只上传照片
- 算法——js(Fibonacci数列)
- JavaScript手机振动API
- JavaScript语法详解(一)
- canvas 常用方法
- JavaScript的with语句
- JS实现拖动效果
- js之Math对象
- js中的 || 与 && 运算符
- json和string 之间的相互转换
- JavaScript中相等和全等操作符的差异
- JSTL标签库
- JSP九大内置对象及四个作用域详解
- 代码: js: 数值操作
- 对长字符串进行省略加...
- JSON 之FastJson解析
- Ext miscellany 整理