javascript - 当图像已经具有 href 标签时，如何将其设为链接？

Question

我正在使用 jQuery 制作一行图像标签。当您将鼠标悬停在图像上时，它会显示不同的内容。

然而，在与用户交谈后，他们中的许多人都试图点击图片。我尝试在图像前添加另一个 href 标签，但这会破坏悬停效果。

有什么想法吗？以下是现有代码。

<li>
  <a href="#tabs-1"><img src=media/home/Sales.png id="circleleft"></a>
</li>
<li>
  <a href="#tabs-2"><img src=media/home/Integration.png id="circlecenterleft"></a>
</li>
<li>
  <a href="#tabs-3"><img src=media/home/Sales1.png id="circlecenterright"></a>
</li>
<li>
  <a href="#tabs-4"><img src=media/home/Blog.png id="circleright"></a>
</li>

Answer 1

不是很标准，但如果您愿意，可以添加 onClick给你的<li>这是图像包装器，然后触发一个重定向页面的函数。你的<a>标签仍然是更好的选择，但这应该有效

<li onclick="myFunction()">Click me</li>

function myFunction() {
  location.assign("http://www.mozilla.org");
}

或者 jQuery 方式

$( "#target" ).click(function() {
  alert( "Handler for .click() called." );
});