href表达式<a href="javascript:;" > < / > ?

我不时地在网页上看到下面的href。然而，我不明白这是要做什么或技术。有人能详细说明吗?

<a href="javascript:;"></a>

当前回答

这是一种让链接在点击时完全不做任何事情的方法(除非Javascript事件绑定到它)。

这是一种运行Javascript而不是跟随链接的方式:

<a href="Javascript: doStuff();">link</a>

当没有javascript要运行时(就像你的例子)，它什么也不做。

其他回答

我一直在寻找一种解决方案，在ipad和手机上不刷新页面，而是打开菜单项。我在手机上也试过，效果很好

基本上不是使用链接来移动页面(或锚点)，使用这个方法启动一个javascript函数。

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

单击该链接将触发警报。

由于这是一个样式问题，而不是用无效的语法污染HTML，你可以/应该使用一个W3有效的解决方案:

正确格式化HTML，不带href，遵循W3按钮可访问性指南。使用CSS来修复在控件上应用可点击UX效果的初始目标。

这里有一个活生生的例子供您尝试用户体验。

HTML

    <a role="button" aria-pressed="false">Underlined + Pointer</a>
    <a role="button" aria-pressed="false" class="btn">Pointer</a>

CSS

    a[role="button"]:not([href]):not(.btn) { text-decoration: underline; }
    a[role="button"]:not([href]) { cursor: pointer; }

<a>元素是无效的HTML，除非它有href或name属性。

如果你想让它正确地呈现为链接(如带下划线的，指针等)，那么只有当它有href属性时才会这样做。

因此，这样的代码有时被用作创建链接的一种方式，但不必在href属性中提供实际的URL。开发人员显然希望链接本身不做任何事情，这是他所知道的最简单的方法。

他可能在其他地方有一些javascript事件代码，当链接被点击时触发，这将是他想要实际发生的，但他希望它看起来像一个正常的<a>标签链接。

一些开发人员使用href='#'来达到同样的目的，但是这会导致浏览器跳转到页面顶部，这可能是不需要的。而且他不能简单地让href为空，因为href= "是一个回到当前页面的链接(即它会导致页面刷新)。

有办法解决这些问题。在href中使用空的Javascript代码就是其中之一，尽管这不是最好的解决方案，但它确实有效。

<a href="javascript:alert('Hello');"></a>

是:

<a href="" onclick="alert('Hello'); return false;"></a>

推荐文章