0

我有一个页面,其中包含跨多个框架的大约 300 个链接。每个链接都有一个对应于至少一个其他帧中的 id 的 id。我正在编写一个脚本,将突出显示两个链接 onmouseover。目前,我可以更改两个链接的文本颜色(见下文)。我想将单个单词后面的背景颜色更改为黄色,以使文本看起来突出显示。

<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";在您的onmouseoverdocument.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 回答