您的位置：首页 > Web前端 > JQuery

jquery操作复选框

2014-02-24 15:33 351 查看

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

<title>jquery操作复选框</title>

<script src="../js/jquery-1.4.2.js" type="text/javascript"></script>

<script type="text/javascript">

$(function(){

$("#allSelect").click(function(){

$(":checkbox").attr("checked",true);

});

$("#noSelect").click(function(){

$(":checkbox:checked").attr("checked",false);

});

$("#fanSelect").click(function(){

$(":checkbox").each(function(){

if($(this).attr("checked")==true){

$(this).attr("checked",false);

}

else{

$(this).attr("checked",true);

}

});

});

})

</script>

</head>

<body>

<ul>

<li><input type="checkbox" />歌曲1</li>

<li><input type="checkbox" />歌曲2</li>

<li><input type="checkbox" />歌曲3</li>

<li><input type="checkbox" />歌曲4</li>

<li><input type="checkbox" />歌曲5</li>

<li><input type="checkbox" />歌曲6</li>

<li><input type="checkbox" />歌曲7</li>

</ul>

<input type="button" value="全选" id="allSelect"/>

<input type="button" value="全不选" id="noSelect"/>

<input type="button" value="反选" id="fanSelect"/>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航