javascript练习----复选框全选，全不选，反选

第一种方式：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><style>body{color: #000}</style>
<script>
document.write("<ul>");
for (var i = 0; i <20; i++) {  创建20个Li document.write("<li>");document.write('<input type="checkbox" name="ids[]" value="'+i+'">ffffffffff'); input名字要加“[]”这样后端程序取得时候为数组。document.write("</li>");}document.write("</ul>");document.write('<a href="javascript:sall()">全选 </a>'); 此a被点击的时候调用sall方法，此处是调用不是赋值所以要加上“()”。document.write('<a href="javascript:nall()">全不选 </a>');document.write('<a href="javascript:fall()">反选 </a>');var unames=document.getElementsByName("ids[]");function sall(){for(var i=0;i<unames.length;i++){unames[i].checked="true";}}function nall(){for(var i=0;i<unames.length;i++){unames[i].checked="";}}function fall(){for(var i=0;i<unames.length;i++){if(unames[i].checked){unames[i].checked="";}else{unames[i].checked="true";}}}
</script>
</head>
<body>
</body>
</html>

第二种方式：

<script>
document.write("<ul>");
for (var i = 0; i <20; i++) {document.write("<li>");document.write('<input type="checkbox" name="ids[]" value="'+i+'">ffffffffff');document.write("</li>");}document.write("</ul>");document.write('<label for="sall"><input type="checkbox" id="sall" οnclick="sall(this)">全选</label>');this把当前的checkbox对象传递给函数内部方便调用该checkbox对象。var unames=document.getElementsByName("ids[]");
function sall(that){for (var i = 0; i <unames.length; i++) {unames[i].checked=that.checked;}
}
</script>

转载于:https://www.cnblogs.com/xiaominwu/p/4348018.html

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/359327.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！