新手javascript判断display值，只能识别block
日期：2014-05-16 浏览次数：20475 次
新手求助：javascript判断display值，只能识别block
目标是：点击一级菜单“one”时，显示二级菜单“one.1,one.2,....”
代码如下：
------解决方案--------------------
目标是：点击一级菜单“one”时，显示二级菜单“one.1,one.2,....”
代码如下：
- JScript code
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="www.budingwang.com" />
<title>无标题 1</title>
<style>
*{margin:0px;padding:0px;}
li{list-style: none;}
li > ul{display:none;}
</style>
</head>
<body>
<ul id="tree">
<li>
<a id="first" href="#">one</a>
<ul id="first_child">
<li>one.1</li>
<li>one.2</li>
</ul>
</li>
</ul>
</body>
<script>
document.getElementById("first").addEventListener("click",nodeAction,false);
function nodeAction(){
if(document.getElementById("first_child").style.display=="block"){ //这里为none时，前两次点击有效，之后无效，搞不懂？？？
document.getElementById("first_child").style.display="none";
}else{
document.getElementById("first_child").style.display="block";
}
}
</script>
</html>
------解决方案--------------------
- JScript code
document.getElementById("first").addEventListener("click",nodeAction,false);
function nodeAction(){
if(document.getElementById("first_child").style.display=="none"){ //这里为none时，前两次点击有效，之后无效，搞不懂？？？
document.getElementById("first_child").style.display="block";
}else{
document.getElementById("first_child").style.display="none";
}
}
------解决方案--------------------
li > ul{display:none;}应该为你这里设置了它隐藏
------解决方案--------------------
我用ie9和谷歌测试均没有问题。。。。。。。可能是浏览器兼容问题，建议用jquery写吧
------解决方案--------------------
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
