Ответ 1
Чтобы заставить non-href A вести себя как A (и быть доступным), вам нужно добавить role=link
, tabindex=0
, стилизовать его, чтобы он выглядел как настоящая ссылка, и добавить код обработчика клавиатуры для лечения Вернитесь как клик. role = "link" недостаточно; экранный редактор может сообщать об этом как ссылку, но без tabindex="0"
и соответствующих визуальных стилей, зрячий пользователь не сможет в нее вставить вклад в первую очередь и без обработчика событий клавиатуры, только пользователи мыши смогут щелкните его. (Обычно пользователи экранных прошивок обычно имеют горячие клавиши для имитации щелчка мышью, но у наблюдателей с клавиатурой, как правило, нет этой опции, поэтому не полагайтесь на нее.)
В качестве альтернативы, если (большой, если!) сумасшедший script, который вы используете для этого, вы можете попробовать выполнить shimming "источник щелчка клавиатуры" (моя терминология). А именно внутри оригинала A: так, где у вас есть:
<a>foo</a>
вы замените его на:
<a><a class='shim' href="javascript:void(0)">foo</a></a>
(class='shim'
требуется только в том случае, если вам нужно сделать материал, описанный позже...)
Вы можете сделать это в jQuery, используя что-то вроде: (заимствование из ответа Джека)
$("a:not([href])").wrapInner("<a class='shim' href='javascript:void(0)'></a>")
Как это работает, так это то, что внутренний добавленный <a ...>
имеет href
, поэтому он отображается как ссылка и можно использовать tabable. Что еще более важно, если пользователь нажимает на него и нажимает на возврат, поведение по умолчанию A преобразует этот ввод клавиатуры в событие click
. Этот конкретный A имеет href
, который возвращает undefined/void (0), поэтому фактическая навигация не происходит, но событие click по-прежнему будет пузыриться до оригинала A, который будет действовать на него.
(Это аккуратный шаблон, позволяющий некоторым родительским элементам, часто DIV или подобным, обрабатывать события кликов, добавляя дочерний элемент tabbable A, который может инициировать события щелчка источника с клавиатуры, дает вам интерфейс, который можно использовать как для мыши, так и для клавиатуры.)
Большой оговоркой здесь является то, что предполагается, что ваш оригинальный script не заботится о target
события. Если этот script проверяет это, он будет запутан, когда он увидит события щелчка, исходящие из прокладки A, а не оригинала As. Один из способов обойти это - захват и повторное создание события, которое может быть затруднительным, и может работать только в последних браузерах - например, используя что-то вроде:
// 'shim' class used so we can do this:
$("a.shim").click(function(e) {
e.preventDefault();
e.stopPropagation();
// the following works if listener using jQuery or is setting onclick directly, otherwise...
// $(e.target).parent().click();.
// More general way to raise events; may need alternate for IE<9
var e2 = document.createEvent("UIEvents");
e2.initUIEvent("click", true, true, window, 1);
e.target.parentNode.dispatchEvent(e2)
});