0

複数のフレームに約 300 個のリンクがあるページがあります。すべてのリンクには、少なくとも 1 つの他のフレームの ID に対応する ID があります。マウスオーバーで両方のリンクを強調表示するスクリプトを書いています。現在、両方のリンクのテキストの色を変更できます (以下を参照)。個々の単語の背景色を黄色に変更して、テキストが強調表示されているように見せたいです。

<html><head><title>Test</title>
  <script>
    function hey(id)
      {document.getElementById(id).style.color = "red";
       window.parent.frames["frame2"].document.getElementById(id).style.color = "red";} 
    function bye(id)
      {document.getElementById(id).style.color = "black";
       window.parent.frames["frame2"].document.getElementById(id).style.color = "black";}
  </script>
</head>
<body>
  <a id="1" class="word" onmouseover="hey(this.id)" onmouseout="bye(this.id)">hello</a> 
  <a id="2" class="word" onmouseover="hey(this.id)" onmouseout="bye(this.id)">world</a>....
</body></html>

ウィンドウの残りの背景を変更せずに、リンクの背景色を変更するにはどうすればよいですか?

4

5 に答える 5

2

リンクを変更することでそれを行うことができるはずですstyle.backgroundColor：

window.parent.frames["frame2"].document.getElementById(id).style.backgroundColor = "yellow";
于 2013-02-20T14:57:23.133 に答える
1

Techfoobarのソリューションを使用して編集されたHTMLは次のとおりです。IDも文字で始まるように変更されます。

<html><head><title>Test</title>
<script>
function hey(id)
  {document.getElementById(id).style.color = "red";
   document.getElementById(id).style.backgroundColor = "yellow";
   window.parent.frames["frame2"].document.getElementById(id).style.color = "red";
   window.parent.frames["frame2"].document.getElementById(id).style.backgroundColor = "yellow";} 
function bye(id)
  {document.getElementById(id).style.color = "black";
   document.getElementById(id).style.backgroundColor = "white";
   window.parent.frames["frame2"].document.getElementById(id).style.color = "black";
   window.parent.frames["frame2"].document.getElementById(id).style.backgroundColor = "white";}
</script>
</head>
<body>
  <a id="w1" class="word" onmouseover="hey(this.id)" onmouseout="bye(this.id)">hello</a> 
  <a id="w2" class="word" onmouseover="hey(this.id)" onmouseout="bye(this.id)">world</a>....
</body></html>
于 2013-02-20T15:16:33.147 に答える
0

これを onmouseover イベントに入れてください:

document.getElementById(id).style.backgroundColor = "red";

onMouseOut イベントの最初の背景色と同じ命令を配置する必要があります。

例えば

 onmouseover="document.getElementById(id).style.backgroundColor = 'red';" onmouseout = "document.getElementById(id).style.backgroundColor = 'white';"
于 2013-02-20T14:58:25.737 に答える
0

まず第一に、あなたidは数字だけであってはならず、数字で始まることもできません。それを編集して、これを配置document.getElementById(id).style.backgroundColor = "red";します: あなたのonmouseoverとdocument.getElementById(id).style.backgroundColor = "black";あなたのonmouseoutイベントに。

于 2013-02-20T14:59:13.357 に答える
0

あなたが望むのは選択だと思います。

function hey(id)
{
   var frame_2_element = window.parent.frames["frame2"].document.getElementById(id);
   document.getElementById(id).style.color = "red";
   frame_2_element.style.color = "red";
   frame_2_element.mozSelection = "yellow";
   frame_2_element.body.mozSelection = "yellow";
}

これにより、選択したテキストの背景色が変更されますが、それは望ましい動作ですか?

于 2013-02-20T15:05:36.743 に答える