1

私のウェブサイトには、ナビゲーションリンクを表す画像を含むナビゲーションリストがあります。imgsrcをより暗いバージョンの画像に変更するonmouseoverjavascript関数を作成しました。

ナビゲーションに複数のリスト要素がある場合（ナビゲーション内のリスト要素の数は動的である）、javascript関数が機能しないことを認識しました。ただし、1つの要素については機能します。

今私はエラーを見つけました：画像はwhile関数で作成されるため、常に同じIDを持ちます。したがって、複数のナビゲーション要素がある場合、同じIDで呼び出される複数の画像があり、もちろんjavascript関数はそれらを参照できません。 。

ひどく、問題を解決するのは非常に難しいと思います。次のアプローチが機能しない理由を誰かに教えてもらえますか？

<html>
<head>
<script
language="JavaScript">
function over(source,c) {
  c.src = "Images/List/streams/"+source+"_mo.png";
}
function out(source,c) {
  c.src = "Images/List/streams/"+source+".png";
}
</script>
</head>
<body>
<?php
...
while($row_player = mysql_fetch_object($players)) {
    $image   = 'pic'.$row_player->Id;
    echo "<a href=".$row_player->Page." target=_parent
    onmouseover= over(".$row_player->Id,$image.")
    onmouseout = out(".$row_player->Id,$image.")> 
    <li>
    <img id=".$image." src=Images/List/streams/".$row_player->Id.".png>
    </li>
    </a>";  
}
...
?>
</body> 
</html>

これは私が最初に使用したコードであり、1つの要素に対してのみ機能します

<html>
<head>
<script
language="JavaScript">
function over(source) {
    pic.src = "Images/List/streams/"+source+"_mo.png";
}
function out(source) {
    pic.src = "Images/List/streams/"+source+".png";
}
</script>
</head>
<body>
<?php
...
while($row_player = mysql_fetch_object($players)) {
        echo "<a href=".$row_player->Page." target=_parent
        onmouseover= over(".$row_player->Id.")
        onmouseout = out(".$row_player->Id.")> 
        <li>
        <img id=pic src=Images/List/streams/".$row_player->Id.".png>
        </li>
        </a>";  
}
...
?>
</body> 
</html>

ちなみに、whileループはすべてエコーになっています。

4

1 に答える 1

1

コードにいくつかのエラーがあります。1つは、overandout関数でcは、は文字列（要素のID）ですが、要素であるかのように扱っているということです。document.getElementById(c).src = ...の代わりに使用してくださいc.src = ...。

もう1つの問題は、引数をonmouseoverとに誤ってエコーしていることですonmouseout。それらをコンマで区切り、引用符で囲む必要があります。の代わりにonmouseover= over(".$row_player->Id,$image.")、

onmouseover=\"over(\"".$row_player->Id."\", \"".$image."\")\"

と同じですonmouseout。HTML属性を引用すると、値にスペースを含めることができます（そして、マークアップが検証されるようになります）。Javascript関数の引数を引用する必要があります。そうしないと、Javascriptは画像IDが文字列ではなく、変数の名前であると見なします。

于 2012-12-20T15:40:42.700 に答える