javascript - href="javascript:func()" vs href="#" onclick="javascript:func()"

Question

<a href="javascript:expand()">  and <a href="#" onclick="javascript:expand()">

有什么不同？

我知道这href="#"是当今更标准的方法。我的问题是我有一个标准下拉菜单，当用户单击切换时会展开/折叠。

如果我href="#"为下面的代码执行此操作，则每当有人单击展开页面时，总是会向右滚动回顶部，这从用户友好的角度来看是不可接受的。

如果我href="javascript:expand()"在用户单击展开时使用，则页面不会移动并且一切正常。

那么如果我只是使用会不会有什么问题href="javascript:expand()"呢？或者我该如何解决，href="#"这样每当用户点击展开时页面就不会滚动回顶部。

谢谢。

编辑：我知道这个问题之前可能已经被问过，但我是从我的角度来看的。我只是寻求建议而不是解释。

score 3 · Accepted Answer

3

最好的选择是不使用<a>元素。使用任何语义上适当的元素或只是<div>代替。

于 2013-07-22T09:21:36.133 回答

score 3 · Accepted Answer

如果您的 JavaScriptonclick事件处理程序返回false，则不会发生滚动。你可以这样做：

<a href="#" onclick="expand(); return false;">

如果您的 onclick 处理程序未返回false，则href链接将被跟踪。在的情况下href="#"，这意味着滚动到页面顶部。

score 0 · Accepted Answer

0

你应该试试：

<a href="javascript:void(0);" onclick="expand();">Expand</a>

于 2013-07-22T09:22:13.607 回答

score 0 · Accepted Answer

如果你想保留href="#"你可以做的

function expand(e) {
  e.preventDefault()
  // ...
}

这会阻止默认的锚点单击行为发生，或者您可以在其末尾返回 false 。

剩下的，看看这个问题：JavaScript function in href vs. onclick，我相信这基本上就是你要问的。

score -1 · Accepted Answer

-1

试试这个，用 href="#" 替换这个 href="javascript:;"

于 2013-07-22T09:24:43.947 回答

5 回答 5