虽然该链接已被禁用，但仍然可以点击。
<a href="/" disabled="disabled">123n</a>
如果它被禁用，我可以让它不可点击吗？我必须使用JavaScript吗？
答案 0 :(得分：219)
在css的帮助下，您将禁用超链接。试试下面的
a.disabled {
pointer-events: none;
cursor: default;
}<a href="link.html" class="disabled">Link</a>
答案 1 :(得分：145)
超链接没有禁用属性。如果您不想要链接某些内容，则需要完全删除<a>标记，或删除其href属性。
答案 2 :(得分：72)
您可以使用：
<a href="/" onclick="return false;">123n</a>
答案 3 :(得分：61)
您可以使用以下解决方案之一：
<a>link</a>
<a href="javascript:function() { return false; }">link</a>
<a href="/" onclick="return false;">link</a>
<a href="www.page.com" disabled="disabled">link</a>
<style type="text/css">
a[disabled="disabled"] {
pointer-events: none;
}
</style>
答案 4 :(得分：21)
试试这个：
<a href="javascript:void(0)" style="cursor: default;">123n</a>
答案 5 :(得分：16)
<a> tag没有disabled属性，仅适用于<input> s（以及<select>和<textarea> s。）
要“禁用”某个链接，您可以删除其href属性，或添加一个返回false的点击处理程序。
答案 6 :(得分：9)
您需要删除<a>标记才能摆脱这种情况。
或尝试使用： -
<a href="/" onclick="return false;">123n</a>
答案 7 :(得分：6)
HTML：
<a href="/" class="btn-disabled" disabled="disabled">123n</a>
CSS：
.btn-disabled,
.btn-disabled[disabled] {
opacity: .4;
cursor: default !important;
pointer-events: none;
}
答案 8 :(得分：5)
提示1：使用CSS pointer-events: none;
提示2：使用JavaScript javascript:void(0)
（这是最佳做法）
<a href="javascript:void(0)"></a>
提示1：使用Jquery $('selector').attr("disabled","disabled");
答案 9 :(得分：5)
让父母拥有a-tag会禁用这样的子<div class="disabled">
<a href="/"></a>
</div>
（要求div覆盖a并且没有0宽度/高度）：
.disabled {
pointer-events: none;
}
其中：
{{1}}
答案 10 :(得分：4)
您可以使用此代码
在运行时使用javascript禁用链接$（'。page-link'）。css（“pointer-events”，“none”）;
答案 11 :(得分：3)
$(document).ready(function() {
$('a').click(function(e) {
e.preventDefault();
});
});
答案 12 :(得分：3)
如果您想摆脱指针，可以使用cursor使用css执行此操作。
答案 13 :(得分：3)
您可以在<a>代码上模拟已停用的属性。
<a href="link.html" disabled="">Link</a>
a[disabled] {
pointer-events: none;
cursor: default;
}
答案 14 :(得分：3)
在我的情况下，我使用
<a href="/" onClick={e => e.preventDefault()}>
答案 15 :(得分：3)
我有一个：
<a href="#">This is a disabled tag.</a>
希望它会对您有所帮助；）
答案 16 :(得分：2)
我能够使用ng-href三元运算
获得所需的结果<a ng-href="{{[condition] ? '' : '/'}}" ng-class="{'is-disabled':[condition]}">123n</a>
其中
a.is-disabled{
color: grey;
cursor: default;
&:hover {
text-decoration: none;
}
}
答案 17 :(得分：1)
正确使用按钮和链接。
•按钮激活网页上的脚本功能（对话框，展开/折叠区域）。
•链接将您带到另一个位置，可以是同一页面上的其他页面或不同位置。
如果您遵循这些规则，则在您需要禁用链接时不会出现任何情况。即使您使链接看起来在视觉上被禁用并且空白onclick
<a href="" ng-click="Ctrl._isLinkActive && $ctrl.gotoMyAwesomePage()"
您不会考虑辅助功能，屏幕阅读器会将其视为链接，视障人士会不断疑惑为什么链接无效。
答案 18 :(得分：1)
我看到这里已经发布了很多答案，但是我认为还没有明确的方法可以将已经提到的方法与我发现的方法结合起来。这是为了使链接既显示为禁用状态，又不将用户重定向到另一个页面。
此答案假定您使用的是 jquery 和 bootstrap ，并使用另一个属性在禁用时临时存储href属性。
//situation where link enable/disable should be toggled
function toggle_links(enable) {
if (enable) {
$('.toggle-link')
.removeClass('disabled')
.prop('href', $(this).attr('data-href'))
}
else {
$('.toggle-link')
.addClass('disabled')
.prop('data-href', $(this).prop('href'))
.prop('href','#')
}
a.disabled {
cursor: default;
}
答案 19 :(得分：1)
我们无法直接停用它，但我们可以执行以下操作
type="button"。href=""属性。disabled属性，以便通过更改courser显示其已禁用，并且变暗。以下是一个例子
<?php
if($status=="Approved"){
?>
<a type="button" class="btn btn-primary btn-xs" disabled> EDIT
</a>
<?php
}else{
?>
<a href="index.php" class="btn btn-primary btn-xs"> EDIT
</a>
<?php
}
?>
答案 20 :(得分：1)
最好的答案总是最简单的。无需任何编码。
如果（a）定位标记没有href属性，则它只是超链接的占位符。所有浏览器都支持！
<a href="/">free web counters</a><br />
<a "/">free web counters</a>
答案 21 :(得分：1)
仅CSS：从href删除链接。
.disable {
pointer-events: none;
cursor: default;
}
答案 22 :(得分：0)
尝试这个
<a href="javascript:void(0)">Click Hare</a>
答案 23 :(得分：0)
答案 24 :(得分：0)
有多种禁用a标签的方法：
<a >Link Text</a> remove the href from your anchor tag <a href=”javascript:void(0)”/>Link text</a> put javascript:void(0) in href <a href="/" onclick="return false;">Link text</a> using return false因为锚标记没有禁用的属性。 如果您想停止jQuery函数内的锚标记行为，则可以在函数的开头使用以下行：
$( "a" ).click(function( e ) {
e.preventDefault();
$( "<div>" )
.append( "default " + e.type + " prevented" )
.appendTo( "#log" );
});
答案 25 :(得分：0)
如果您使用的是WordPress，我创建了一个插件，可以执行此操作以及更多操作，而无需知道如何编写任何代码。您需要做的就是添加要禁用的链接的选择器，然后选择“在新选项卡中禁用使用此选择器的所有链接”。从出现的下拉菜单中，然后单击更新。
Click here to view a gif that demonstrates this
您可以get the free version from the WordPress.org Plugin repository进行尝试。
答案 26 :(得分：0)
<a href="/" disabled="true" onclick="return false">123</a>
只需添加：这通常有效，但如果用户在浏览器中禁用了javascript，则无法正常工作。
1）您可以选择在锚标记上使用Bootstrap 3类来禁用href标记，在集成bootstrap 3插件后
<a href="/" class="btn btn-primary disabled">123n</a>
或者
2）了解如何在浏览器中使用html或js启用javascript。 或创建弹出窗口告诉用户在使用网站前启用javascript
答案 27 :(得分：0)
当鼠标悬停在浏览器窗口的左下角时， href 标记中的任何内容都会显示。
我个人认为向用户显示 javascript：void（0）等内容是可怕的。
相反，请关闭 href ，使用jQuery /其他任何内容完成您的魔法并添加样式规则（如果您仍然需要它看起来像链接）：
a {
cursor:pointer;
}
答案 28 :(得分：-1)
如果您只是想暂时禁用链接但是稍后将href保留在那里（这是我想要做的），我发现所有浏览器都使用第一个href。因此我能够做到：
<a class="ea-link" href="javascript:void(0)" href="/export/">Export</a>
答案 29 :(得分：-1)
您可以通过返回false来禁用锚标记。在我的情况下，我使用角度和ng禁用Jquery手风琴，我需要禁用这些部分。
所以我创建了一个小js片段来解决这个问题。
<a class="opener" data-toggle="collapse"
data-parent="#shipping-detail"
id="shipping-detail-section"
href="#shipping-address"
aria-expanded="true"
ng-disabled="checkoutState.addressSec">
Shipping Address</a>
<script>
$("a.opener").on("click", function () {
var disabled = $(this).attr("disabled");
if (disabled === 'disabled') {
return false;
}
});
</script>
答案 30 :(得分：-1)
<a href="/shopcart/">
<button class="btn" disabled> Make an Order </button>
</a>
默认情况下，在<button>上具有 disabled （禁用）属性不会使点击从<button>元素一直到<a>元素。因此<a>元素甚至不知道发生了一些点击。通过在<button>上添加/删除已禁用属性进行操作。
答案 31 :(得分：-1)
适合我的变体：
<script>
function locker(){
if ($("a").hasClass("locked")) {
$("a").removeClass('locked').addClass('unlocked');
$("a").attr("onClick","return false");
} else {
$("a").css("onclick","true");
$("a").removeClass('unlocked').addClass('locked');
$("a").attr("onClick","");
}
}
</script>
<button onclick="locker()">unlock</button>
<a href="http://some.site.com" class="locked">
<div>
....
<div>
</a>