购物车中常用的全选与全不选

来源:互联网 发布:手机淘宝兼职赚钱 编辑:程序博客网 时间:2024/06/05 05:34

直接上事例:

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>string对象模型</title>
<style type="text/css">
</style>
</head>


<body>
<input type="text" id="text" onfocus="run()" />
<span id="span"></span>
<h1>
全选/全不选/管你怎么选<input type="checkbox" id="allno" onclick="run()">
</h1>
篮球
<input type="checkbox" name="lan1" /> zu球
<input type="checkbox" name="lan1" /> bao球
<input type="checkbox" name="lan1" /> li球
<input type="checkbox" name="lan1" />
<h1>
<input type="button" value="全不选" id="no" onclick="no()" />
</h1>
<h1>
<input type="button" value="全选" id="all" onclick="quan()" />
</h1>
</body>
<script type="text/javascript">
function quan() {
//全选:是为了获得所有的ID标签,并将循环将标签的属性设置为选择
var a = document.getElementsByName("lan1");
for (var i = 0; i < a.length; i++) {
//获取每一个对象
var temp = a[i];
temp.checked = true;
}
};
function no() {
//全不选:获得所有的name 标签,他是数组,将所有的标签属性设置为false
var no = document.getElementsByName("lan1");
for (var i = 0; i < no.length; i++) {
//获得每一个标签
var temp = no[i];
temp.checked = false;
}
}
//全选 全不选
function run() {
//获得所有的标签
var a = document.getElementById("allno");
if (a.checked == true) {
quan();
} else {
no();
}
}
</script>
</html>