Какой должна быть ссылка, используя якорь в качестве действия JavaScript?

Question

Я видел (и использовал) код, чтобы ссылка порождала действие javascript много раз в моей жизни, но я никогда не приходил к четкому выводу, должен ли атрибут href быть пустым или #. Есть ли у вас какие-либо предпочтения, и если да, то почему?

<a href="" onclick="javascript: DoSomething();">linky</a>

или

<a href="#" onclick="javascript: DoSomething();">linky</a>

Answer 1

Вы должны иметь что-то для атрибута href, иначе браузер не будет обрабатывать его как ссылку (например, сделать его фокусируемым или подчеркнуть его) - Вот почему использование "#" стало распространенным явлением.

Кроме того, содержимое атрибутов события (onclick, onmouseover, on...) уже обрабатывается как javascript: вам не нужно предварять его javascript:

Итак, учитывая ваш пример, лучший способ сделать это встроенным (что само по себе не является лучшим способом, , вероятно, ), выглядит следующим образом:

<a href="#" onclick="DoSomething(); return false">linky</a>

Answer 2

Оформить обсуждение на Href для ссылок на Javascript: «#» или «javascript: void (0)»? .

Кроме того, если оставить href пустым, браузер не будет использовать курсор-указатель, когда пользователь наводит курсор мыши, хотя это можно исправить с помощью CSS.

Answer 3

Я всегда использую # как имеющий javascript: внутренняя часть атрибутов html обычно считается плохой практикой в ​​эти дни.

Таким образом, вы должны попытаться воздержаться от использования атрибутов onclick = и использовать вместо этого прослушиватели javascript во внешних файлах .js.

Например, вы используете jQuery ..

$(".link").click(function(e) {
    e.preventDefault();
    DoSomething();
});

Answer 4

В подобных случаях, когда вы не хотите предоставлять опцию без поддержки JavaScript, я предпочитаю:

<a href="javascript:// open xxx widget" onclick="DoSomething();">linky</a>

Таким образом, вы можете по крайней мере предоставить текстовое описание плана в качестве комментария JavaScript.

Answer 5

Почему бы не указать ссылку на страницу, объясняющую, что у них отключен JavaScript, и им нужно включить его, чтобы получить недостающую функциональность?

Поскольку ссылка будет идти только тогда, когда у них отключен JavaScript, пусть это будет что-то информативное!

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