javascript - 左键点击激活oncl​​ick 右击激活href

Question

我有一个 img 标签作为(这当然不是确切的语法)

<img src="http://localhost/img/img_1.png" id=1 onclick="say_hi(id)" href="/img_page_1/" alt="Aim Pic" width="230" height= "164" />

我在这里需要的是当用户左键单击 img 时，我需要触发 onClick，当用户右键单击它时，它必须像一般的 href 显示选项(“在新窗口中打开”等)一样

我需要它的原因是，我想通过模糊页面的其余部分来显示与主页中的图像相关的页面预览(这里使用 ajax 在 say_hi 函数中加载图像页面的预览)并且当用户右键单击我希望它看起来像一个普通的 href，以便他可以直接在其他选项卡中打开页面而不是预览。

编辑: 简单来说，我想声明/写/给出一些图像的链接，这些图像在右键单击时通常充当链接(显示具有链接所有选项的上下文菜单)但它必须触发 onClick 事件(或运行javascript 中的函数)当左键单击时。

谢谢。

Answer 1

在回复问题编辑时删除了之前的答案。

---

新的编辑要简单得多，请参阅以下内容(以内联 JavaScript 为例 - 这是不好的做法，不应在任何生产代码中使用 - 请参阅 here 和 here 了解更多信息.):

HTML/内联 JS:

<a href="/img_page_1/" onclick="left_click(id)">
  <img src="http://localhost/img/img_1.png">
</a>

首先，href 不是图像上的有效属性 - 将其提供给 anchor (<a>)，然后您可以将其环绕图像。

只有左键单击会触发您的功能，右键单击仍具有默认行为。

功能:

function left_click(id) {
  event.preventDefault(); // Prevents the default anchor action.
  // Rest of your function here.
}

在这里，我们阻止 anchor 触发的默认行为 - 阻止链接将您带到不同的页面。

jsFiddle example.