HTML 锚标记是否应该尊重 Disabled 属性？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7000927/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Should the HTML Anchor Tag Honor the Disabled Attribute?
提问by David Hoerster
If I create an HTML anchor tag and set the disabledattribute to true, I get different behaviors in different browsers (surprise! surprise!).
如果我创建一个 HTML 锚标记并将disabled属性设置为 true，我会在不同的浏览器中得到不同的行为（惊奇！惊奇！）。
I created a fiddleto demonstrate.
我创建了一个小提琴来演示。
In IE9, the link is grayed out and does not transfer to the HREF location. In Chrome/FF/Safari, the link is the normal color and will transfer to the HREF location.
在 IE9 中，链接是灰色的并且不会转移到 HREF 位置。在 Chrome/FF/Safari 中，链接是正常颜色，将转移到 HREF 位置。
What should the correct behavior be? Is IE9 rendering this incorrectly and I should implement some CSS and javascript to fix it; or is Chrome/FF/Safari not correct and will eventually catch up?
正确的行为应该是什么？IE9 是否错误地渲染了这个，我应该实现一些 CSS 和 javascript 来修复它；还是 Chrome/FF/Safari 不正确，最终会赶上？
Thanks in advance.
提前致谢。
采纳答案by Jason Gennaro
IE appears to be acting incorrectly in this instance.
在这种情况下，IE 似乎表现不正确。
See the HTML5 spec
请参阅 HTML5 规范
The IDL attribute disabled only applies to style sheet links. When the link element defines a style sheet link, then the disabled attribute behaves as defined for the alternative style sheets DOM. For all other link elements it always return false and does nothing on setting.
禁用的 IDL 属性仅适用于样式表链接。当 link 元素定义样式表链接时，disabled 属性的行为与为替代样式表 DOM 定义的一样。对于所有其他链接元素，它始终返回 false 并且在设置时不执行任何操作。
http://dev.w3.org/html5/spec/Overview.html#the-link-element
http://dev.w3.org/html5/spec/Overview.html#the-link-element
The HTML4 spec doesn't even mention disabled
HTML4 规范甚至没有提到 disabled
http://www.w3.org/TR/html401/struct/links.html#h-12.2
http://www.w3.org/TR/html401/struct/links.html#h-12.2
EDIT
编辑
I think the only way to get this effect cross-browser is js/css as follows:
我认为跨浏览器获得这种效果的唯一方法是js/css，如下所示：
#link{
text-decoration:none;
color: #ccc;
}
js
js
$('#link').click(function(e){
e.preventDefault();
});
回答by hernant
I had to fix this behavior in a site with a lot of anchors that were being enabled/disabled with this attribute according to other conditions, etc. Maybe not ideal, but in a situation like that, if you prefer not to fix each anchor's code individually, this will do the trick for all the anchors:
我不得不在一个站点中修复此行为，其中有许多锚点根据其他条件等使用此属性启用/禁用。 也许不理想，但在这种情况下，如果您不想修复每个锚点的代码单独来说，这将适用于所有锚点：
$('a').each(function () {
$(this).click(function (e) {
if ($(this).attr('disabled')) {
e.preventDefault();
e.stopImmediatePropagation();
}
});
var events = $._data ? $._data(this, 'events') : $(this).data('events');
events.click.splice(0, 0, events.click.pop());
});
And:
和：
a[disabled] {
color: gray;
text-decoration: none;
}
回答by Karmic Coder
回答by Jabare Mitchell
The JQuery answer didn't work for me because my anchor tag is on a form and on my forms I use asp field validators and they just weren't playing nice. This led me to finding a pretty simple answer that doesn't require JQuery or CSS...
JQuery 答案对我不起作用，因为我的锚标记位于表单上，而在我的表单上我使用 asp 字段验证器，但它们的效果不佳。这让我找到了一个不需要 JQuery 或 CSS 的非常简单的答案......
<a id="btnSubmit" href="GoSomePlace">Display Text</a>
You can disable the element and it should behave as input types do. No CSS needed. This worked for me in chrome and ff.
您可以禁用该元素，它的行为应与输入类型相同。不需要 CSS。这在 chrome 和 ff 中对我有用。
function DisableButton() {
var submitButton = document.getElementById("btnSubmit");
if (submitButton != null) {
submitButton.setAttribute('disabled', 'disabled');
}
}
Of course you'll be doing a loop to disable all anchor tags in the DOM but my example shows how to do it for just one specific element. You want to make sure you're getting the right client id of your element but this worked for me, on more than one occasion. This will also work on asp:LinkButtons which end up being anchor tag elements when rendered in the browser.
当然，您将执行循环以禁用 DOM 中的所有锚标记，但我的示例展示了如何仅针对一个特定元素执行此操作。您想确保获得元素的正确客户端 ID，但这对我有用，不止一次。这也适用于 asp:LinkButtons，当在浏览器中呈现时，它最终成为锚标记元素。
