javascript - 空链 anchor

Question

我有一个不会去任何地方但有一个 onclick 的 anchor (例如 <a onclick="..."></a> )。我的问题与 href 有关属性。我应该为值设置什么？

如果我简单地省略 href , anchor 没有适当的装饰——当鼠标放在它上面时，鼠标指针图标没有改变。

如果我使用 href="#" ，然后在单击链接时窗口会滚动到页面顶部。

如果我使用 href="javascript:..."并输入 onclick 的值进行中javascript: , 单击链接时，页面将离开，地址栏包含 Javascript。

当我提到浏览器行为时，我指的是 Chrome，我正在其中对其进行测试。

我应该为 href 放什么？当 anchor 不是实际链接而只是为了拥有 onclick 而存在时执行行为？

Answer 1

理想情况下您可以为那些禁用 Javascript 的用户提供一个选项:

<a href="degrade_option.html" onclick="return fancy_option();">do the option!</a>

如果您不喜欢那种东西，虽然您确实应该喜欢，但最常见的方法是使用英镑，然后取消事件以防止发生默认操作，如下所示:

<a href="#" onclick="return do_something();">do something</a>

但是你必须确保 do_something 返回 false。 (或者您可以在点击处理程序的末尾添加 return false;，但这会变得更加难看)

不过，老实说，您真的不应该以内联 Javascript 属性作为开始。它们是不好的做法，是维护的噩梦，而且还有更好的选择。

编辑:针对您的评论，备选方案是 unobtrusive javascript :

"Unobtrusive JavaScript" is an emerging technique in the JavaScript programming language, as used on the World Wide Web. Though the term is not formally defined, its basic principles are generally understood to include:

• Separation of functionality (the "behavior layer") from a Web page's structure/content and presentation
• Best practices to avoid the problems of traditional JavaScript programming (such as browser inconsistencies and lack of scalability)
• Progressive enhancement to support user agents that may not support advanced JavaScript functionality

阅读页面以获取一些示例。