如何使锚标记什么都没有引用？

我使用jQuery，我需要使一些锚标记不执行任何操作。

我通常这样写：

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

但是，这是指页面的顶部！

如果您不希望它指向任何内容，则可能不应该使用<a>（anchor）标签。

如果您希望某些东西看起来像一个链接，但不像一个链接，则最好使用适当的元素（例如<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”，那么我假设您想附加一个click事件处理程序。如果是这样，请执行与上述相同的操作，然后使用类似以下JavaScript的代码：

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

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

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;">

不是最简洁的解决方案，而是解决了上述方法的所有问题。

要使其完全不执行任何操作，请使用以下命令：

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

处理此问题的正确方法是在处理链接时使用jQuery“断开”链接

的HTML

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

JS

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

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

最后两个呼叫将停止浏览器解释点击。

有很多方法可以做到

不添加href属性

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

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

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

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

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

没什么意思

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

要么

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

我想你可以尝试

<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

该答案应进行更新以反映新的Web标准（HTML5）。

这个：

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

...是有效的HTML5。tabindex属性使它可以像普通超链接一样在键盘上聚焦。您最span好像前面提到的那样使用该a元素，但是我发现使用该元素更为优雅。

参见：https : //w3c.github.io/html-reference/a.html
和：https : //html.spec.whatwg.org/multipage/links.html#attr-hyperlink-href

以下是<a>标记的href标记属性不引用的三种方式：

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

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

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

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

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

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

然后用jQuery

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

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

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

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

您可以具有a不带href属性的HTML锚（标记）。离开href属性，它将不会链接到任何内容：

<a>link</a>

唯一对我有用的是上述各项的组合：

首先是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");

你可以做到

<a style='cursor:pointer' >Link</a>

<a href="#" onclick="SomeFunction()"  class="SomeClass">sth.</a>

这是我的锚标签。因此，在onClick =“”事件上返回false此处无效。我刚刚删除了href =“＃”属性，它对我一样有效，如下所示

<a onclick="SomeFunction()"  class="SomeClass">sth.</a>

我需要添加此CSS。

.SomeClass
{
    cursor: pointer;
}

我在WordPress网站上遇到此问题。下拉菜单上的标题始终具有属性，href=""并且仅使用允许标准URL的标题插件。最简单的解决方案是在页脚中运行以下代码：

jQuery('[href=""]').click(function(e){
    e.preventDefault();
});

这将防止空白锚执行任何操作。

React不再支持href="javascript:void(0)"在锚标记中使用类似这样的功能，但这在某些情况下效果很好。

<a href="#" onClick={() => null} >link</a>

我知道这被标记为jQuery问题，但是您也可以使用AngularJS回答。

在您的元素中，添加ng-click指令，并使用$ event变量（即click事件）...防止其默认行为：

<a href="#" ng-click="$event.preventDefault()">

您甚至可以将$ event变量传递给函数：

<a href="#" ng-click="doSomething($event)">

在该函数中，您可以对click事件进行任何操作。