如何在锚标记内使用图像

Question

<a href="xyz.php"><div id="some_id"><p>
<span class="storeName">name</span>
<span>phone number</span>
</p><img onclick="javascript:printStoreMap('+ e[0] +');" 
alt="Print Map"
src="/images/btn_print_map.png"></div></a>

这是我的代码。

我想要的行为是，如果我应该单击 div，它应该转到 xyz.php。如果我单击“打印地图”图像，则应该发生其他事情，并且锚标记的单击事件不应该起作用，这意味着它不应该转到 xyz.php 页面。只有那个 javascript 函数应该起作用。

我该怎么做？我不明白这个。因此，如果有人知道我如何才能做到这一点，请以这种方式告诉我。

Answer 1

为什么不将 移到 标记之外？ （如果您希望它适用于键盘用户，您应该给它自己的 标记，并将 onclick 放在 上。）

另外，什么是

的要点？它可以让您做哪些现有 无法做到的事情？

编辑：如果您必须有div元素 - 当您可以设置锚元素的样式时，实际上您不应该需要它来进行样式设置 - 并且您希望图像位于同一个div内，那么为什么不拥有两个锚点，每个你想要点击的东西都有一个：

<div id="some_id">
  <a href="xyz.php">
    <p>
      <span class="storeName">name</span>
      <span>phone number</span>
    </p>
  </a>
  <a onclick="printStoreMap('+ e[0] +'); return false;">
    <img alt="Print Map" src="/images/btn_print_map.png">
  </a>
</div>

同样，有两个锚点可以让键盘用户使用。

（否则，为了让您的 HTML 保持原样，在我看来这是一个坏主意，您可以阅读事件 preventDefault()、stopPropagation() 和/或 cancelBubble。）

顺便说一下，尝试在字符串中间包含变量是怎么回事："javascript:printStoreMap('+ e[0] +');" （应该到处都是双引号，还是整个 HTML 块是您尚未发布的带有单引号的字符串赋值的一部分，或者...？）另请注意分配事件处理程序时不需要 javascript 一词。