Как переопределить отключенную стилизацию гиперссылок?

Question

Можно ли переопределить стиль, который применяется к гиперссылке, если он имеет атрибут disabled="disabled"?

В настоящее время он неактивен. Не надо делать активной ссылкой, просто хочу изменить шрифт, цвет и т. Д.

ОБНОВЛЕНИЕ: Должно работать в IE6, IE7 и FF

ОБНОВЛЕНИЕ: Это хуже, чем я, хотя HTML-код <A id="someId" disabled>About Your Group</A>

ОБНОВЛЕНИЕ: Мне действительно нужно посмотреть, что добавляет это «отключенное» к ссылкам .. Я думаю это плагин jquery .. (ui.tabs, jquery ui.tabs ) * * тысяча двадцать-один

Answer 1

Свойство disabled нельзя использовать для a элементов. применяется только к элементам input, select и button.

Конечно; Internet Explorer накладывает эффект скоса на ссылки с этим набором свойств. FireFox, с другой стороны, полностью игнорирует это свойство.

Примечание: Ссылки по-прежнему будут работать. Их поведение по умолчанию НЕ предотвращено - они просто выглядят отключенными. Они не ведут себя как отключенный ввод текста.


Вам лучше использовать класс, чтобы сигнализировать, если ссылка отключена. Это также будет работать в разных браузерах ...:

CSS

.disabled { color: #ccc; }

HTML

<a href="..." class="disabled">...</a>

и для завершения отключенного эффекта; используя jQuery, вы можете выбрать все ссылки с классом «отключен» и предотвратить их поведение по умолчанию, например:

$(function ()
{
    $("a.disabled").click(function ()
    {
        // return false to disable the link (preventDefault = true)
        return false;
    });
});

Answer 2

Я заметил, что ASP.Net помещает disabled = "disabled" в теги <a> при установке свойства Enable на false для <asp:HyperLink>.

Это приводит к тому, что css-правила для этого элемента игнорируются в IE (даже для a[disabled="disabled]!), Что крайне раздражает. Другим браузерам все равно, так как они игнорируют это свойство.

Мое решение состояло в том, чтобы просто установить для свойства NavigationUrl значение null в коде для элементов, которые я хотел отключить.

Преимущество использования этой серверной части вместо JavaScript состоит в том, что она будет работать, даже если у пользователей отключен JavaScript.

Answer 3

Я не знаю, в какой степени атрибут disabled поддерживается для гиперссылок.Убедитесь, что вы тщательно протестировали.Я вижу два способа нацеливания этого в CSS:

CSS 2.1

Вы можете попробовать селектор атрибута CSS 2.1

a[disabled=disabled] { color: blue }

Я думаю,скорее всего, будет работать с неформальным элементом.Не работает в IE <= 6. <a href="http://www.quirksmode.org/css/selector_attribute.html" rel="nofollow noreferrer"> Таблица совместимости Quirksmode .

CSS 3

В CSS 3,возможно использовать псевдокласс :disabled ( source )

input:disabled {  background-color: yellow; }

не работает ни в одном IE, включая 8. Работает в Firefox, Chromeи опера. Таблица совместимости Quirksmode

Я никогда не видел, чтобы disabled использовался для нормальной гиперссылки, поэтому вам придется попробовать, работает ли это.Согласно спецификации, псевдокласс disabled предназначен только для отключенных элементов формы .

Answer 4

Если вы используете ASP.NET и отключаете LinkButton на стороне сервера, сгенерированный HTML-код представляет собой тег <a> с disabled="disabled" нестандартным атрибутом. Однако сгенерированный атрибут href не создается, поэтому ссылка не будет вести себя как ссылка ни в одном из браузеров.

Проблема в том, что IE добавляет типичный "эффект скоса" к отключенной ссылке, а другие браузеры отображают его как "обычный текст".

Вы можете решить проблему в стилях браузеров, отличных от IE, следующим образом:

a:not([href]) /* this is for ASP.NET disabled links */
{
  opacity: .5; /* all but IE before 9 */
}

Проблема в том, что IE (по крайней мере, до IE 8) продолжает делать эффект "скоса" на отключенной ссылке. Чтобы IE работал так же, как другие браузеры, вам нужно изменить стиль CSS, добавив этот нестандартный фильтр attirbute (работает только для IE):

filter: alpha(opacity=50);

И вам также нужно использовать некоторый javascript, то есть jQuery, чтобы удалить некорректный отключенный атрибут. * 1017 Т.е. *

$('#controlId').attr('disabled','')

Если ваш случай еще более странный, и у вас есть disabled и href, вам следует удалить также href, чтобы стиль можно было применить, а ссылка не работала.

Answer 5

Я не думаю, что есть атрибут 'disabled' для гиперссылки (в любом случае он не учитывает рекомендации w3c), но вы можете попробовать добавить класс для стилизации этих элементов, например:

<a class="inactive" ...>...</a>

и для css:

a.inactive {
  color:#000
}