以下是构建链接的两种方法,该链接的唯一目的是运行JavaScript代码。在功能、页面加载速度、验证目的等方面,哪个更好。?

函数myJsFunc(){警报(“myJsFunc”);}<a href=“#”onclick=“myJsFunc();”>运行JavaScript代码</a>

or

函数myJsFunc(){警报(“myJsFunc”);}运行javascript代码</a>


当前回答

javascript:void(0)将在将来弃用,因此您应该使用#。

其他回答

我看到了很多想继续使用#values for href的人的答案,因此,这里有一个答案,希望能让两个阵营都满意:

A) 我很高兴将javascript:void(0)作为我的href值:

<a href="javascript:void(0)" onclick="someFunc.call(this)">Link Text</a>

B) 我正在使用jQuery,并希望#作为我的href值:

<a href="#" onclick="someFunc.call(this)">Link Text</a>

<script type="text/javascript">
    /* Stop page jumping when javascript links are clicked.
       Only select links where the href value is a #. */
    $('a[href="#"]').live("click", function(e) {
         return false; // prevent default click action from happening!
         e.preventDefault(); // same thing as above
    });
</script>

注意,如果您知道链接不会动态创建,请改用单击功能:

$('a[href=“#”]').click(函数(e){

老实说,我两个都不建议。我会使用一个样式化的<button></button>来实现该行为。

按钮链接{显示:内联块;位置:相对;背景色:透明;光标:指针;边框:0;填充:0;颜色:#00f;文本装饰:下划线;字体:inherit;}<p>一个看起来像<button type=“button”class=“link”>链接</button>的按钮</p>

这样您就可以分配onclick。我还建议通过脚本绑定,而不是在元素标记上使用onclick属性。唯一的问题是旧IE中无法禁用的伪3d文本效果。


如果必须使用A元素,请使用javascript:void(0);由于已经提到的原因。

如果onclick事件失败,将始终进行拦截。不会发生错误的加载调用,或基于哈希更改触发其他事件如果单击失败(onclick throws),哈希标记可能会导致意外行为,除非这是一个适当的失败行为,并且您希望更改导航历史记录,否则请避免它。

注意:您可以将0替换为javascript:void('删除记录123')之类的字符串,它可以作为一个额外的指示符,显示单击的实际操作。

因此,当您使用<a/>标记执行某些JavaScript操作时,如果您也放入href=“#”,则可以在事件末尾添加return false(如果是内联事件绑定),如:

<a href="#" onclick="myJsFunc(); return false;">Run JavaScript Code</a>

或者您可以使用JavaScript更改href属性,如:

<a href="javascript://" onclick="myJsFunc();">Run JavaScript Code</a>

or

<a href="javascript:void(0)" onclick="myJsFunc();">Run JavaScript Code</a>

但从语义上讲,上述所有实现这一点的方法都是错误的(尽管它很好)。如果没有创建任何元素来导航页面,并且有一些JavaScript内容与之相关,那么它不应该是<a>标记。

您可以根据需要简单地使用<button/>来做事情或任何其他元素,如b、span或任何适合的元素,因为您可以在所有元素上添加事件。


因此,使用<a href=“#”>有一个好处。在执行a href=“#”时,默认情况下会在该元素上获得光标指针。为此,我认为您可以使用CSS,比如cursor:pointer;这也解决了这个问题。

最后,如果您从JavaScript代码本身绑定事件,那么如果您使用的是<a>标记,则可以使用event.prpreventDefault()来实现这一点,但如果您没有使用<a>标签,则可以获得一个优势,您不需要这样做。

所以,如果你看到了,最好不要对这种东西使用标签。

我会使用:

<a href="#" onclick="myJsFunc();return false;">Link</a>

原因:

这使得href变得简单,搜索引擎需要它。如果您使用其他任何东西(例如字符串),它可能会导致404未找到错误。当鼠标悬停在链接上时,它不会显示它是一个脚本。通过使用return false;,页面不会跳到顶部或断开后退按钮。

不要忽视这样一个事实,即您的URL可能是必需的——在引用之后会触发onclick,因此有时您需要在导航离开页面之前处理客户端的某些内容。