读书人

jquery一个小案例-关于复选框的一个案

发布时间: 2012-10-11 10:16:10 作者: rapoo

jquery一个小案例------关于复选框的一个案例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head>  <title> New Document </title>  <meta name="Generator" content="EditPlus">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">   <script type="text/javascript" src="jquery-1.4.4.js"></script>   <script type="text/javascript">function checkMain( m){var flag=$(m).attr("checked");$(m).parent().next().find("input[type=checkbox][name=menu]").attr("checked",flag);}function checkSub(n){var flag=$(n).attr("checked");if(flag){$(n).parent().parent().parent().prev().find("input[type=checkbox][name=menu]").attr("checked",flag);}else{var size=$(n).parent().parent().parent().find("input:checked[type=checkbox][name=menu]").size();if(size==0){$(n).parent().parent().parent().prev().find("input[type=checkbox][name=menu]").attr("checked",false);}}}function selectAll(){$("input[type=checkbox][name=menu]").attr("checked",true);}function unSelect(){$("input[type=checkbox][name=menu]").attr("checked",false);}  </script> </head> <body><ul><li><div><input type="checkbox" name="menu" onclick="checkMain(this)" />菜单1</div><ul><li><div><input type="checkbox" name="menu" onclick="checkSub(this)" />菜单1.1</div></li><li><div><input type="checkbox" name="menu" onclick="checkSub(this)" />菜单1.2</div></li><li><div><input type="checkbox" name="menu" onclick="checkSub(this)" />菜单1.3</div></li></ul></li><li><div><input type="checkbox" name="menu" onclick="checkMain(this)" />菜单2</div><ul><li><div><input type="checkbox" name="menu" onclick="checkSub(this)" />菜单2.1</div></li><li><div><input type="checkbox" name="menu" onclick="checkSub(this)" />菜单2.2</div></li></ul></li><li><div><input type="checkbox" name="menu" onclick="checkMain(this)" />菜单3</div></li></ul><input type="button" value="全选" onclick="selectAll()"></input><input type="button" value="不选" onclick="unSelect()"></input></body></html>

?

读书人网 >Web前端

热点推荐