Question

在我编写的HTML脚本中，我设置了一个JS函数，以便当用户单击文本时，它会链接到网站并更改文本的颜色。我最终复制了那个脚本并创建了一个带有更改的新脚本（包括取出JS函数）。现在我正在尝试重新启用该功能，但它无法正常工作。回顾原始脚本，该函数在那里工作，并且与原始函数相比，函数的使用在新版本中看起来正确...所以我有点卡在文本为什么不再改变颜色。

这是JS函数：

<script>
    function openPortal() {       
      window.open("http://www.google.com");
      document.getElementById("winapp").style.color="BlueViolet ";
    }</script>

这里用HTML调用，首先作为图像链接起作用（显然我不希望图像的颜色改变，这不是我的问题），其次作为文本单击时未改变颜色的链接：

        <!--App Portal Link [Image] -->
<div style="left:23%" id="winlogo">
<p class="pos_winsym" id="winapp" onclick="openPortal()">
<span style="cursor:pointer">
<img src="winlogo.jpg" width="90" height="80">
    </span></div></p>
<p class="pos_winmsg">For Windows Applications
<br>

        <!--App Portal Link [Text] -->
<span style="cursor:pointer">
<a id="winapp" onclick="openPortal()" style="font-size:90%">Click here
    </a></p></span>

关于为什么颜色不再变化的任何想法都会非常有用！谢谢！

仅供参考 - 请告诉我是否需要更多代码，我只提供了我认为与情况相关的内容。

Answer 1

您有两个相同的ID：

<p class="pos_winsym" id="winapp" onclick="openPortal()">

在这里：

<a id="winapp" onclick="openPortal()" style="font-size:90%">Click here
</a>

删除<p>中的ID：

<p class="pos_winsym" onclick="openPortal()">

<强> Fiddle Example

Answer 2

修改您的id为唯一页面不能包含两个相同的id

或者您可以按如下方式修改您的功能：

function openPortal( elem ) {       
   window.open("http://www.google.com");
   elem.style.color="blueviolet ";
}

您的onclick值为openPortal( this )

Working demo

JS onclick功能不再用于更改链接颜色

2 个答案: