Javascript内联onclick转到本地锚

我有一个按钮作为图像

<img src="button.png" />

---

用锚定标签把它包起来。您不需要使用JS

<a data-role="none" href="#page10"><img src="button.png" /></a>

---

看起来，

onClick

应该是：

onclick="document.location+='#goToPage';return false;" 

---

公认答案中给出的解决方案有一个重要问题，即它只能使用一次。每次连续单击都会将

#goToPage

附加到位置，窗口不会导航到定位点

一种解决方案是在附加新锚固件之前移除锚固件零件：

function goToAnchor(anchor) {
  var loc = document.location.toString().split('#')[0];
  document.location = loc + '#' + anchor;
  return false;
}

用法示例：

<a href="#anchor" onclick="goToAnchor('anchor')">Anchor</a>

---

注意：锚点需要用引号括起来，不带哈希前缀。

尝试将/slash用于root或/folder/，这样可以多次使用

onclick="document.location='/#goToPage';return false;" 

onclick="document.location='/folder/#goToPage';return false;" 

---

你看到这个答案了吗？也许这会有帮助，有没有理由不只是将图像包装在超链接中？是的，原因是我正在使用JQuery Mobile，它会自动添加类，以查看您是否正在使用JQuery（或者希望通过设置顶部位置以真正手动的方式进行），还包括您可以对其进行“动画”或其他操作，FWIW.不能这样做，因为它是jquery mobile，当我添加“根据”时，你可以将

数据role=“none”

添加到

中，以防止它添加额外的类刚刚对此投了反对票，但这似乎仍然是6年后最合适的答案。不知道为什么人们觉得需要用JS将其过度复杂化。仅仅因为OP要求JS解决方案并不意味着其他人是不正确的。更重要的是，请参见@foz的评论，了解为什么JS需求不是必需的。也不适用于某些框架，如引导按钮，这些框架要求您使用

href=…

来表示“其他内容”，但在许多情况下仍然是一个很好的答案：）请参见下面的Tivie答案。它指出这个答案只能用一次。之后，它只是在URL的末尾附加一个#标记，什么也不做。这是有史以来最酷的解决方案！

<a href="#anchor" onclick="goToAnchor('anchor')">Anchor</a>

onclick="document.location='/#goToPage';return false;" 

onclick="document.location='/folder/#goToPage';return false;"