Деактивировать ссылку с событием клика DOM - PullRequest
1 голос
/ 10 сентября 2009

Этот вопрос в основном из любопытства (у меня другое рабочее решение этой проблемы). Попытка сделать какое-то базовое прогрессивное улучшение: каждая строка таблицы должна быть кликабельной, чтобы перейти на другую страницу с помощью JavaScript. Для людей без JavaScript есть ссылка в первом столбце каждой строки. Если JavaScript включен, ссылки должны быть отключены. Один из многих простых способов сделать это -

a.setAttribute("onclick", "return false;");

после инициализации событий щелчка по строкам. Но кажется более элегантным использовать addEventListener для достижения того же

a.addEventListener("click", function() { return false; }, false);

Однако последнее не работает. Я полагаю, что причина этого заключается в том, что таким образом можно добавить более одного слушателя событий, и если они будут возвращать разные значения истинности, результат будет неоднозначным. Это предположение правильно или я что-то не так делаю? Пожалуйста, объясните внутреннюю работу этого.

Ответы [ 2 ]

2 голосов
/ 10 сентября 2009
a.addEventListener("click", function(event) { event.preventDefault(); return false; }, false);

Это должно соответствовать вашим потребностям.

1 голос
/ 10 сентября 2009

a.setAttribute ("onclick", "return false;");

Избегайте setAttribute, он вам никогда не понадобится для обработки документов HTML, и есть проблемы с браузером (особенно с IE, особенно с обработчиками событий). Вместо этого используйте прямые свойства DOM HTML:

a.onclick= function() {
    return false;
};

addEventListener - это хорошо, если вы используете protectDefault (), как предложено fphilipe, но вам потребуется резервная копия attachEvent для IE, где DOM Events не поддерживаются. Это может быть излишним, если вы просто попытаетесь отключить ссылку.

Лично для отключения ссылки я бы предпочел полностью избавиться от нее, чтобы она больше не была доступна для таких операций, как open-in-new-window или bookmark-link, и не принимала участие в клавиатуре порядок табуляции.

Таким образом, вы можете удалить Chhild () или заменить Child на диапазон с тем же текстом или удалить текст из ссылки:

while (a.firstChild)
    a.parentNode.insertBefore(a.firstChild, a);
a.parentNode.removeChild(a);
...