如何制作锚标签什么都没有？

Question

我使用jQuery,我需要让一些锚标签不执行任何操作.

我通常这样写:

<a href="#">link</a>

但是这指的是页面顶部!

Answer 1

有一些不完美的解决方案:

1.链接到假锚

<a href="#">

问题:单击链接会跳回页面顶部

2.使用"a"以外的标签

使用span标记并使用jquery处理单击

问题:打破键盘导航,必须手动更改悬停光标

3.链接到javascript void函数

<a href="javascript:void(0);">
<a href="javascript:;">

问题:在IE中链接图像时中断

解

由于这些都有他们的问题,我已经解决的解决方案是链接到假锚,然后从onClick方法返回false:

<a href="#" onClick="return false;">

不是最简洁的解决方案,但它解决了上述方法的所有问题.

Answer 2

如果你不想让它指向任何东西,你可能不应该使用<a>(锚)标记.

如果您希望某些内容看起来像链接但不像链接那样,最好使用适当的元素(例如<span>),然后使用CSS设置样式:

<span class="fake-link" id="fake-link-1">Am I a link?</span>

.fake-link {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

另外,鉴于您标记了此问题"jQuery",我假设您要附加点击事件处理程序.如果是这样,只需执行与上面相同的操作,然后使用类似以下JavaScript的内容:

$('#fake-link-1').click(function() {
    /* put your code here */
});

Answer 3

要使它什么都不做,请使用:

<a href="javascript:void(0)"> ... </a>

Answer 4

处理此问题的正确方法是在处理链接时使用jQuery"中断"链接

HTML

<a href="#" id="theLink">My Link</a>

JS

$('#theLink').click(function(ev){
    // do whatever you want here

    ev.preventDefault();
    ev.stopPropagation();
});

最后两个调用会停止浏览器解释点击.

Answer 5

什么都没有意思？

<a href='about:blank'>blank page</a>

要么

<a href='whatever' onclick='return false;'>won't navigate</a>

Answer 6

有很多方法可以做到这一点

不要添加和href属性

<a name="here"> Test <a>

您可以添加onclick事件而不是href之类的

<a name="here" onclick="YourFunction()"> Test <a>

或者你可以添加像这样的void函数,这将是最好的方法

<a href="javascript:void(0);"> 
<a href="javascript:;">

Answer 7

我想你可以试试

<a href="JavaScript:void(0)">link</a>

我在这里看到的唯一问题是高级浏览器安全性可能会提示执行javascript.

虽然这是比较容易的方式之一

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

这应该谨慎使用

阅读本文以获取一些指示https://web.archive.org/web/20090301044015/http://blog.reindel.com/2006/08/11/a-hrefjavascriptvoid0-avoid-the-void

Answer 8

应该更新此答案以反映新的Web标准(HTML5).

这个:

<a tabindex="0">This represents a placeholder hyperlink</a>

...是有效的HTML5.tabindex属性使其像普通超链接一样可以进行键盘调焦.你可以使用span前面提到的元素,但我发现使用a元素更优雅.

请参阅:http://dev.w3.org/html5/markup/a.html
和:http://www.w3.org/html/wg/drafts/html/master/links.html#attr-hyperlink-href

Answer 9

以下是<a>tag的hreftag属性引用的三种方法:

<a href="JavaScript:void(0)"> link </a>

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

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

Answer 10

我知道这是一个老问题，但我想还是要加上两分钱：

这取决于链接的功能，但是通常，我会将链接指向可能显示/执行相同操作的URL，例如，如果您要弹出一些有关框的信息：

<a id="about" href="/about">About</a>

然后用jQuery

$('#about').click(function(e) {
    $('#aboutbox').show();
    e.preventDefault();
});

这样，非常老的浏览器（或禁用了JavaScript的浏览器）仍可以导航到单独的“关于”页面，但是更重要的是，Google还将选择此页面并对“关于”页面的内容进行爬网。

Answer 11

唯一对我有用的是以上内容的组合：

首先li在ul

<li><a onclick="LoadTab2_1()" href="JavaScript:void(0)">All Assigned</a></li>

然后在LoadTab2_1中我手动切换选项卡div。

$("#tabs-2-1").hide();
    $("#tabs-2-2").show();

这是因为断开连接也会断开选项卡中的操作。

当主选项卡发生更改时，您还需要手动设置选项卡样式。

$("#secTab1").addClass("ui-tabs-active").addClass("ui-state-active").addClass("ui-state-hover").addClass("ui-state-focus");
    $("#secTab1 a").css("color", "#ffffff");

Answer 12

确保您要停止的所有链接都具有href="#!"（或真正想要的任何链接），然后使用此链接：

jq('body').on('click.stop_link', 'a[href="#!"]',
function(event) {
     event.preventDefault();
});

Answer 13

您可以拥有一个a没有href属性的 HTML 锚点（标签）。离开href属性 & 它不会链接到任何东西：

<a>link</a>