2011-09-23 64 views
3

假设我有一个触发一些javascript的标签。例如:什么是触发javascript的链接的最佳做法

HTML:

<a href="#" id="some_id">Trigger action!</a> 
<!-- or, with appripriate CSS : --> 
<span id="some_other_id">Trigger action!</span> 

的jQuery:

$("#some_id").click(function() { 
    alert("some action") 
}); 

我最好如何做到这一点?

我的问题是当我悬停在链接上时,我应该在浏览器的左下角看到什么?即什么是href值应该是

如果响应是'无',那么正确的方法是跨度。

的一些方法,例如:http://jsfiddle.net/M3qkU/5/

回答

3

这取决于你正在做一个网页还是一个Web应用程序。

如果您正在制作网页,请尝试让链接对尚未启用JavaScript的用户有用。这样,JavaScript是增强页面,而不是它所需的工作。这被称为progressive enhancement。例如:假设你有一个页面,你希望它有标签。按顺序将这些制表符放入元素中,并为每个制表符的元素赋予一个id值。将您带到这些选项卡的导航链接的片段中将包含id值(例如,#movies将带您到达movies元素  —浏览器为您完成此操作)。然后,当您的JavaScript加载时,让它将这些元素变成标签并接管这些链接的操作。

如果您正在执行一个Web应用程序,并且该链接在UI中触发了“页面更改”或“选项卡更改”类别的更改,请将其保留为链接并将href作为片段(例如,#movies)它描述了应用程序在发生时切换到的“页面”或“选项卡”。您甚至可以在处理链接时使用该信息,并且可以在最初加载页面时使用它,以便您的各种页面状态可以链接。如果“链接”不会在应用程序中导致位置样式更改,则大多数情况下会使其成为按钮(您可以将button元素设置为非常重要的程度,但我不会让它们看起来像链接) 。

0

有大量的理论这个的。 Mine:

  • an a标记只能在链接到内容时使用。在这种情况下,应该有一个有效的href。在链接的内容将被加载在页面上(模态,ajax等)的情况下,JS会覆盖href并完成它的工作。

  • 页面级交互(按钮,可点击图标等)不应该是链接,因为没有JavaScript,它们没有任何用处。在这种情况下,他们应该使用与a不同的标签。

当然,我总是自己破坏这些规则。

从技术上讲,href="#"将使页面在大多数浏览器中滚动到顶部。如果你使用这个,那么你必须小心,总是重载JS中的href ...这很容易忘记。因此,对于纯JavaScript交互a标签,我建议使用href="javascript:;"

2

两种情况:

  • ,如果你有一个后备与JavaScript后的作品(如登录表单,在覆盖打开也可以打开为常规页面),然后使用指向该页面的<a>链接,并触发overlay/javascript操作。

  • ,如果它是没有回退的元素,不使用<a>(如一些触发行内编辑器)

但是,不管你做什么,不要使用<a href="javascript:soemthing()">因为用户将该链接视为链接的“网址”,并且可能会造成混淆。


至于<a href="#">,我不建议这样做是(即使它的广泛使用),因为像前面mentionned,它并不指向一个真正的位置。

在这种情况下使用<a>的唯一的好处是,你得到一个手形光标,但可以使用cursor:pointer在CSS中有光标在您的非<a>元素。

+1

by fallback he means '...'和'YourBrowserDoesNotSupportJavascript.html' ***亲切地告诉用户他们正在使用一个需要一个耳光的古老的浏览器。 – rlemon

+1

如果页面不能在没有javascript的情况下不能运行,我会使用带粗体红色文字的

+0

'

相关问题