HTML Anchor Tag是否应该授予禁用属性？

Question

如果我创建一个HTML锚标记并将该disabled属性设置为true,我会在不同的浏览器中获得不同的行为(惊喜!惊喜!).

我创造了一个小提琴演示.

在IE9中,链接显示为灰色,并且不会传输到HREF位置.在Chrome/FF/Safari中,链接是正常颜色,将传输到HREF位置.

正确的行为应该是什么？是IE9渲染错误,我应该实现一些CSS和JavaScript来修复它; 或者Chrome/FF/Safari不正确并最终会赶上？

提前致谢.

Answer 1

我必须在具有许多锚点的站点中修复此行为,这些锚点根据其他条件启用/禁用此属性等.可能不理想,但在这种情况下,如果您不想修复每个锚点的代码单独来说,这将成为所有锚点的诀窍:

$('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());
});

和:

a[disabled] {
    color: gray;
    text-decoration: none;
}

Answer 2

IE在这种情况下似乎行为不正确.

请参阅HTML5规范

禁用的IDL属性仅适用于样式表链接.当link元素定义样式表链接时,disabled属性的行为与替代样式表DOM的定义相同.对于所有其他链接元素,它始终返回false并且在设置时不执行任何操作

http://dev.w3.org/html5/spec/Overview.html#the-link-element

HTML4规范甚至没有提到 disabled

http://www.w3.org/TR/html401/struct/links.html#h-12.2

编辑

我认为跨浏览器获得此效果的唯一方法是js/css如下:

#link{
    text-decoration:none;
    color: #ccc;
}

JS

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

示例:http://jsfiddle.net/jasongennaro/QGWcn/

Answer 3

disabled是一个仅适用于标准input元素的属性.IE可能会支持它,但如果你想要符合标准,你会想要使用CSS/JS.a