<a 标签中有两个函数？答案

【问题标题】：two functions in <a tag?<a 标签中有两个函数？
【发布时间】：2011-04-20 03:38:24
【问题描述】：

我有这个：

<div id="click"><a href="link.html"><img src="img/image.png" alt="something"></a>

<a 
   onmouseover="ReverseContentDisplay('cont'); return true;"
   href="javascript:ReverseContentDisplay('cont')">
info
</a>
</div>
<div id="cont"></div>

现在，当我将鼠标悬停在显示“信息”的文本位上时，<div id="cont"></div> 出现。但是，我现在需要更改标记，以便锚标记具有链接（而不是 javascript 函数），并在鼠标悬停时显示 cont div。

【问题讨论】：

我发现很难理解您的问题。可以考虑改写吗？
我不确定编辑是否捕捉到了原始的意图，我认为这意味着内容显示在鼠标悬停上（不是它取代了任何东西）并且 href 需要能够成为链接。

标签： javascript html image href

【解决方案1】：

Here is an example of what you may want to do。它通过从 HTML 中删除 JS 来提供不显眼的 Javascript。 HTML 是：

<div id="click"><a href="link.html"><img src="img/image.png" alt="something"></a>
    <!-- the href attribute below should have whatever link you want -->
    <a id="showCont" href="http://www.google.com">info</a>
</div>
<div id="cont">Cont</div>

javascript 将位于一个单独的文件中，该文件由 <script> 标记引用，并且是：

window.onload = init; // call init on load

function init() {
    document.getElementById("showCont").onmouseover = function() { ReverseContentDisplay("cont") }; // set up the onmouseover handler
}

function ReverseContentDisplay(id) {
    var elem = document.getElementById(id);
    if(elem.style.display === "block") {
        elem.style.display = "none";
    } else {
        elem.style.display = "block";
    }
}

CSS 也将在一个单独的文件中，并且如下隐藏 cont div：

#cont {
    display:none;
}

【讨论】：

【解决方案2】：

我不确定我是否理解问题所在，但如果您想保持悬停状态并且仍然有一个工作链接，只需将 URL 放入 href 属性中即可。

其他提示： 1. 你在做什么不是语义的。将标记与行为或风格分开。您应该为单击 JavaScript 中的链接添加一个事件侦听器。 2. 记住渐进增强，并不是每个人都打开了 JavaScript。 3.你为什么在onmouseover返回true？如果它有目的（虽然我没有看到）你应该在函数中返回 true。

【讨论】：