返回JS全选练习...登陆

JS全选练习

A 玖陆柒贰2019-01-24 12:58:59148

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>全选</title>

<style type="text/css">

.box{width: 250px;margin: 0 auto;}

h3{text-align: center;}

input{margin-right:14px; }

</style>

</head>

<body>

<div class="box">

<fieldset>

<h3>你最喜欢的球类运动</h3><hr/>

<form>

<input type="checkbox" name="item[]" >篮球

<input type="checkbox" name="item[]" >足球

<input type="checkbox" name="item[]" >羽毛球<br/>

<input type="checkbox" name="item[]" >桌球

<input type="checkbox" name="item[]" >马球

<input type="checkbox" name="item[]" >乒乓球<hr/>

</form>

<input type="checkbox" id="checkall" onclick="checkAll()"><label for="checkall">我都喜欢</label>

<input type="checkbox" id="uncheckall" onclick="uncheckAll()"><label for="uncheckall">我都不喜欢</label>

</fieldset>

</div>

<script type="text/javascript">

function checkAll(){

var checkall,item;

checkall=document.getElementById('checkall')

item=document.getElementsByName("item[]")

for(var i=0;i<item.length;i++){

if(checkall.checked){

item[i].checked=true;

}else{

item[i].checked=false;

}

}

// function uncheckAll(){

// var checkall,item;

// checkall=document.getElementById('uncheckall')

// item=document.getElementsByName("item[]")

// for(var i=0;i<item.length;i++){

// if(uncheckall.checked){

// item[i].checked=false;

// }

// }

}

</script>

</body>

</html>



设想是用两个框,一个是全选,一个是全部取消勾选,但是好像冲突了,


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送