Вопрос

Рассмотрим следующий код:

$("a").attr("disabled", "disabled");

В IE и FF это сделает привязки неактивными, но в браузерах на основе WebKit (Google Chrome и Safari) это ничего не даст.Атрибут Disabled хорош тем, что его легко удалить, и он не влияет на атрибуты href и onclick.

Есть ли у вас какие-либо предложения о том, как получить желаемый результат.Ответы должны быть:

  • Легко вернуться, так как я хочу отключить элементы управления вводом формы, пока у меня выполняется вызов AJAX.
  • Должен работать в IE, FF и WebKit.
Это было полезно?

Решение

Я предполагаю, что у вас есть обработчик событий onclick, привязанный к этим якорным элементам.Просто попросите обработчик событий проверить атрибут «отключено» и отменить событие, если оно установлено.Ваш обработчик событий будет выглядеть примерно так:

$("a").click(function(event){
  if (this.disabled) {
    event.preventDefault();
  } else {
    // make your AJAX call or whatever else you want
  }
});

Вы также можете установить правило таблицы стилей для изменения курсора.

a[disabled=disabled] { cursor: wait; }

Изменить - упростил проверку «отключено», как предложено в комментариях.

Другие советы

Мне пришлось исправить это поведение на сайте с большим количеством привязок, которые включались/отключались с помощью этого атрибута в зависимости от других условий и т. д.Возможно, это не идеально, но в такой ситуации, если вы предпочитаете не исправлять код каждого якоря индивидуально, это подойдет для всех якорей:

$('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;
}
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top