0

サイトにメニュー（ツリー）を作成しました。ユーザーがそのメニューをクリックすると、さらに 2 つのメニューが表示されます。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.allIE4イズムです。これは非標準であり、約 15 年前に (広くサポートされている) に置き換えられましたdocument.getElementById('id_of_element')。

于 2013-08-06T06:58:28.283 に答える
1

かなりの問題があります。

  • すでに述べたように、document.all は不要になった IE4+ 固有のコードです。
  • JavaScript プロトコルは使用しないでください - 使用しない理由はたくさんありますが、1 つを除いて、それを支持する理由はありません: ステータスは、リンクが 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){     
var div=document.getElementById(id)
div.style.display= (div.style.display=="block")? "none" : "block";
}
于 2013-08-06T07:07:15.383 に答える
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 に答える