Отключить привязки в Chrome/WebKit/Safari.
-
05-07-2019 - |
Вопрос
Рассмотрим следующий код:
$("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;
}