0

我在我的网站上创建了菜单（树）。当用户单击该菜单时，它将显示另外两个菜单。它适用于除Firefox浏览器之外的所有浏览器。谁能告诉我有什么问题？

html代码

<li><a href="JavaScript:ok('tree1');">Sport</a></li>
<div id="tree1" style="display:none;">
    <li><a href="national_sport.php">National Sport</a></li>
    <li><a href="international_sport.php">International Sport</a></li>
</div>

javascript代码

function ok(id){
    if(document.all(id).style.display == "none") {
        document.all(id).style.display="block";
    }
    else{
        document.all(id).style.display="none";
    }
}

预先感谢！

4

4 回答 4

4

document.all是一个 IE4 主义。它是非标准的，大约在 15 年前被（广泛支持的）取代document.getElementById('id_of_element')。

于 2013-08-06T06:58:28.283 回答
1

有不少问题。

  • 如前所述，document.all 是 IE4+ 特定的代码，不再需要
  • 请不要使用 javascript 协议 - 有很多理由不使用它，而且没有一个对它有利，除了一个：状态将向用户显示链接是 javascript
  • 建议使用不显眼的脚本并将事件处理程序附加到脚本中的链接而不是内联。
  • 您的 HTML 无效

因此，将我所做的评论转换为代码并不显眼地添加它，我得到了

现场演示 

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
window.onload=function() {
  var links = document.getElementsByTagName("a");
  for (var i=0, n=links.length;i<n;i++) {
    if (links[i].id.indexOf("_link") !=-1) {
      links[i].onclick=function() {
        var id=this.id.split("_")[0]; // get the prefix
        var sub = document.getElementById(id);
        sub.style.display=sub.style.display=="block"?"none":"block";
        return false; // stop following the link
      }
    }
  }
}
</script>
</head>
<body>
<ul>
  <li><a id="tree1_link" href="#">Sport</a>
    <ul id="tree1" style="display:none">
      <li><a href="national_sport.php">National Sport</a></li>
      <li><a href="international_sport.php">International Sport</a></li>
    </ul>
  </li>
</ul>
</body>
</html>
于 2013-08-06T07:54:22.550 回答
0 
function ok(id){
    if(document.getElementById(id).style.display == "none" ) {
        document.getElementById(id).style.display="block";
    }
    else{
        document.getElementById(id).style.display="none";
    } 
}
于 2013-08-06T06:58:59.267 回答
0 
function ok(id){     
var div=document.getElementById(id)
div.style.display= (div.style.display=="block")? "none" : "block";
}
于 2013-08-06T07:07:15.383 回答