禁用使用jQuery的超链接

<a href="gohere.aspx" class="my-link">Click me</a> 

我做了

 $('.my-link').attr('disabled', true); 

但它没有工作

有没有简单的方法来禁用使用jQuery的超链接？ 删除href？ 我宁愿不捣鼓href。 所以，如果我可以做到这一点，而无需删除href，那就太好了。

Answer 1

您可以绑定一个返回false的点击处理程序：

 $('.my-link').click(function () {return false;}); 

要重新启用它，请解除绑定处理程序：

 $('.my-link').unbind('click'); 

请注意， disabled不起作用，因为它仅用于表单input。

---

jQuery已经预料到了这一点，提供了一个jQuery 1.4.3的捷径：

 $('.my-link').bind('click', false); 

并解除/重新启用：

 $('.my-link').unbind('click', false); 

Answer 2

我知道这是一个古老的问题，但似乎还没有解决。 遵循我的解决scheme…

只需添加这个全局处理程序

 $('a').click(function() { return ($(this).attr('disabled')) ? false : true; }); 

这是一个快速演示： http : //jsbin.com/akihik/3

你甚至可以添加一些CSS来给所有带有disabled属性的链接赋予不同的风格。

例如

 a[disabled] { color: grey; } 

无论如何，似乎禁用的属性是无效a标签。 如果您喜欢遵循w3c规范，则可以轻松采用符合html5的data-disabled属性。 在这种情况下，您必须修改以前的代码片段并使用$(this).data('disabled') 。

Answer 3

除去href属性绝对好像还有一段路要走。 如果由于某种原因，你以后需要它，我会把它存储在另一个属性，例如

 $(".my-link").each(function() { $(this).attr("data-oldhref", $(this).attr("href")); $(this).removeAttr("href"); }); 

这是唯一的办法做到这一点，将使链接显示禁用以及编写自定义的CSS。 只要将点击处理程序绑定到false，就会使链接显示为正常链接，但点击它时不会发生任何事情，这可能会让用户感到困惑。 如果你要去点击处理程序的路线，我至less也会.addClass("link-disabled")并写一些CSS，使该类的链接看起来像普通文本。

Answer 4

 $('.my-link').click(function(e) { e.preventDefault(); }); 

你可以使用：

 $('.my-link').click(function(e) { return false; }); 

但我不喜欢自己使用它，因为它更加神秘，即使它在很多jQuery代码中被广泛使用。

Answer 5

pointer-events CSS属性在支持（ caniuse.com ）方面有点不足，但是非常简洁：

 .my-link { pointer-events: none; } 

Answer 6

 function EnableHyperLink(id) { $('#' + id).attr('onclick', 'Pagination("' + id + '")');//onclick event which u $('#' + id).addClass('enable-link'); $('#' + id).removeClass('disable-link'); } function DisableHyperLink(id) { $('#' + id).addClass('disable-link'); $('#' + id).removeClass('enable-link'); $('#' + id).removeAttr('onclick'); } .disable-link { text-decoration: none !important; color: black !important; cursor: default; } .enable-link { text-decoration: underline !important; color: #075798 !important; cursor: pointer !important; } 

Answer 7

我相信所有的HTML元素的disabled属性都是无效的，请参阅MSDN文章 。 这和残疾人的适当价值是简单的“残疾人”。 你最好的办法是绑定一个返回false的点击函数。

Answer 8

附加一个包含pointer-events的类：non

 .active a{ //css text-decoration: underline; background-color: #fff; pointer-events: none;} $(this).addClass('active'); 

Answer 9

下面将用它的文本replace链接

 $('a').each(function () { $(this).replaceWith($(this).text()); }); 

编辑：

以上给出的代码将只与文本超链接，它不会与图像。 当我们尝试使用图片链接时，它不会显示任何图片。

为了使这个代码兼容图像链接下面将正常工作

 // below given function will replace links with images ie for image links $('a img').each(function () { var image = this.src; var img = $('<img>', { src: image }); $(this).parent().replaceWith(img); }); // This piece of code will replace links with its text ie for text links $('a').each(function () { $(this).replaceWith($(this).text()); }); 

解释：在上面给出的代码片断，在第一个片段中，我们只用它的图像replace所有的图像链接。 之后，我们用文本replace文本链接。

Answer 10

这也很好。 简单，精简，不需要使用jQuery。

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

Answer 11

尝试：

 $(this).prop( "disabled", true );