首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

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

2012-10-11 
jquery一个小案例------关于复选框的一个案例!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional/

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>

?

热点排行