Какое значение «href» я должен использовать для ссылок JavaScript, «#» или «javascript: void (0)»?

Я использую javascript:void(0).

Три причины. Поощрение использования # среди команды разработчиков неизбежно приводит к некоторому использованию возвращаемого значения функции, вызванной как это:

function doSomething() {
    //Some code
    return false;
}

, Но тогда они забывают использовать return doSomething() в onclick и просто использовать doSomething().

А вторая причина предотвращения # состоит в том, что финал return false; не выполнится, если вызванная функция бросит ошибку. Следовательно разработчики должны также не забыть обрабатывать любую ошибку соответственно в вызванной функции.

причина трети А состоит в том, что существуют случаи, где onclick свойство события присвоено динамично. Я предпочитаю быть в состоянии вызвать функцию или присвоить ее динамично, не имея необходимость кодировать функционально-специализировано для одного метода вложения или другого. Следовательно мои onclick (или на чем-либо) в разметке HTML похожи на это:

onclick="someFunc.call(this)"

ИЛИ

onclick="someFunc.apply(this, arguments)"

Используя [1 111] избегает всех вышеупомянутых головных болей, и я не нашел примеров оборотной стороны.

Поэтому, если Вы - одинокий разработчик тогда, можно ясно сделать собственный выбор, но если Вы работаете командой, необходимо или заявить:

Использование href="#", удостоверьтесь onclick, всегда содержит return false; в конце, что любая вызванная функция не бросает ошибку и если Вы присоединяете функцию динамично к onclick, свойство удостоверяется, что, а также не бросок ошибки возвращается false.

ИЛИ

Использование href="javascript:void(0)"

второе ясно намного легче передать.

Только для взятия точки часть из другого упомянула.

намного лучше связать событие 'onload'a или $ ('документ') .ready {}; тогда помещать JavaScript непосредственно в событие щелчка.

В случае, что JavaScript не доступен, я использовал бы href для текущего URL, и возможно привязку к позиции ссылки. Страница все еще быть применимой для людей без JavaScript те, кто имеет, не заметит различия.

, Поскольку у меня есть он для вручения, вот некоторый jQuery, который мог бы помочь:

var [functionName] = function() {
   // do something
};

jQuery("[link id or other selector]").bind("click", [functionName]);

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

, Если это не имеет смысла, используйте # в качестве эти href атрибут. Мне не нравится использовать эти onclick атрибут, так как он встраивает JavaScript непосредственно в HTML. Лучшая идея состояла бы в том, чтобы использовать внешний файл JS и затем добавить обработчик событий к той ссылке. Можно тогда предотвратить стандартное событие так, чтобы URL не изменялся для добавления # после того, как пользователь нажимает его.

, Если Вы используете ссылку в качестве пути к всего , выполняют некоторый код JavaScript (вместо того, чтобы использовать промежуток как D4V360, значительно предложенный), просто сделайте:

<a href="javascript:(function()%7Balert(%22test%22)%3B%7D)()%3B">test</a>

при использовании ссылки с onclick для навигации не используйте href = "#" как нейтрализация, когда JavaScript выключен. Это является обычно очень раздражающим, когда пользователь нажимает на ссылку. Вместо этого предоставьте ту же ссылку, которую onclick обработчик предоставил бы, если это возможно. Если Вы не можете сделать этого, пропустите onclick и просто используйте URI JavaScript в href.

Если Вы используете <a> элемент, просто используйте это:

<a href="javascript:myJSFunc();" />myLink</a>

Лично я присоединил бы обработчик событий с JavaScript позже вместо этого (использующий attachEvent или addEventListener или возможно < поместите свою любимую платформу JavaScript здесь > также).

Ни один, если Вы спрашиваете меня;

, Если Ваша "ссылка" имеет единственную цель выполнить некоторый код JavaScript, это не квалифицирует как ссылка; скорее часть текста с функцией JavaScript, связанной с ним. Я рекомендовал бы использовать <span> тег с onclick handler присоединенный к нему и некоторый основной CSS для подражания ссылке. Ссылки сделаны для навигации, и если Ваш код JavaScript не для навигации, это не должно быть <a> тег.

Пример:

function callFunction() { console.log("function called"); }

.jsAction {
    cursor: pointer;
    color: #00f;
    text-decoration: underline;
}

<p>I want to call a JavaScript function <span class="jsAction" onclick="callFunction();">here</span>.</p>

Первый, идеально с реальной ссылкой для следования в случае, если пользователю отключили JavaScript. Просто удостоверьтесь, что возвратили false, чтобы препятствовать тому, чтобы событие щелчка стреляло, если JavaScript выполняется.

<a href="#" onclick="myJsFunc(); return false;">Link</a>

, Если Вы используете Angular2, этот путь работы:

<a [routerLink]="" (click)="passTheSalt()">Click me</a>.

Посмотрите здесь https://stackoverflow.com/a/45465728/2803344

Хорошо иметь Ваш сайт быть доступным пользователями с отключенным JavaScript, в этом случае href указывает на страницу, которая выполняет то же действие как выполняемый JavaScript. Иначе я использую" #" с" return false;" для предотвращения действия по умолчанию (прокрутите к верхней части страницы) как другие упомянули.

Гугление для" javascript:void(0)" предоставляет большую информацию об этой теме. Некоторые из них, как этот причины упоминания для НЕ используют пусто (0) .

Идеально Вы сделали бы это:

<a href="javascriptlessDestination.html" onclick="myJSFunc(); return false;">Link text</a>

Или, еще лучше, у Вас была бы ссылка действия по умолчанию в HTML, и Вы добавите onclick событие к элементу незаметно через JavaScript после рендеринга DOM, таким образом удостоверяясь, чтобы, если JavaScript не, представили/использовали Вас, не имеют бесполезных обработчиков событий, пронизывающих Ваш код и потенциально запутывающих (или по крайней мере отвлекающих от) Ваше фактическое содержание.

'#' заберет пользователя к верхней части страницы, таким образом, я обычно иду с void(0).

javascript:; также ведет себя как javascript:void(0);

Я соглашаюсь с предложениями, в другом месте заявляя, что необходимо использовать регулярный URL в href атрибут, затем вызовите некоторую функцию JavaScript в onclick. Дефект, который они автоматически добавляют return false после вызова.

проблема с этим подходом, что, если функция не будет работать или если будет какая-либо проблема, ссылка станет неактивируемой по щелчку. Событие Onclick будет всегда возвращаться false, таким образом, нормальный URL не назовут.

существует очень простое решение. Позвольте функциональному возврату true, если он работает правильно. Тогда используйте возвращенное значение, чтобы определить, должен ли щелчок быть отменен или нет:

HTML

<a href="path/to/some/url" onclick="return !doSomething();">link text</a>

function doSomething() {
    alert( 'you clicked on the link' );
    return true;
}

Примечание, что я инвертирую результат эти doSomething() функция. Если это будет работать, это возвратится true, таким образом, это будет отрицаться (false), и эти path/to/some/URL не будет назван. Если функция возвратится false (например, браузер не поддерживает что-то используемое в функции, или что-либо еще идет не так, как надо), это отрицается к [1 111], и эти path/to/some/URL назван.

Я полагаю, что Вы представляете ложную дихотомию. Это не эти только две опции.

я согласовываю с г-ном D4V360, кто предложил, чтобы, даже при том, что Вы используете тег привязки, у Вас действительно не было привязки здесь. Все, что Вы имеете, является специальным разделом документа, который должен вести себя немного отличающийся. <span> тег является намного более соответствующим.

Я рекомендую использовать <button> элемент вместо этого, особенно , если управление, как предполагается, вызывает изменение в данных. (Что-то как POST.)

еще лучше при введении элементов незаметно, типа прогрессивного улучшения. (См. этот комментарий .)

В зависимости от того, что Вы хотите выполнить, Вы могли забыть onclick и просто использовать href:

<a href="javascript:myJsFunc()">Link Text</a>

Это обходит потребность возвратить false. Мне не нравится # опция, потому что, как упомянуто, она возьмет пользователя к верхней части страницы. Если необходимо где-то в другом месте отправить пользователя, если у них нет JavaScript включенным (который редок, где я работаю, но очень хорошая идея), то предложенный метод Steve работает отлично.

<a href="javascriptlessDestination.html" onclick="myJSFunc(); return false;">Link text</a>

Наконец, можно использовать javascript:void(0), если Вы не хотите, чтобы кто-либо пошел куда-нибудь и если Вы не хотите вызывать функцию JavaScript. Это работает отлично, если у Вас есть изображение, Вы хотите, чтобы событие mouseOver произошло с, но нет ничего для пользователя для нажатия.

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

Ни один.

, Если у Вас может быть фактический URL, который делает использование смысла что как HREF. onclick не будет стрелять, если кто-то щелкнет средней кнопкой по Вашей ссылке для открытия новой вкладки или если им отключили JavaScript.

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

я понимаю, что это не всегда возможно, но по-моему это должно бороться за в разработке любого общедоступного веб-сайта.

Выезд Незаметный JavaScript и Прогрессивное улучшение (обе Википедии).

Было бы лучше использовать jQuery,

$(document).ready(function() {
    $("a").css("cursor", "pointer");
});

и опустить и href="#" и href="javascript:void(0)".

разметка тега привязки будет похожа

<a onclick="hello()">Hello</a>

Достаточно проста!

Обычно, у Вас должен всегда быть осенний обратный канал, чтобы удостовериться, что у клиентов с JavaScript, отключенным все еще, есть некоторая функциональность. Это понятие называют незаметным JavaScript.

Пример... Скажем, у Вас есть переходящая поисковая ссылка:

<a href="search.php" id="searchLink">Search</a>

можно всегда делать следующее:

var link = document.getElementById('searchLink');

link.onclick = function() {
    try {
        // Do Stuff Here        
    } finally {
        return false;
    }
};

Тот путь, люди с отключенным JavaScript направлены к search.php в то время как Ваши средства просмотра с представлением JavaScript Ваша расширенная функциональность.

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

Можно также записать подсказку в привязке как это:

<a href="javascript:void('open popup image')" onclick="return f()">...</a>

, таким образом, пользователь будет знать то, что делает эта ссылка.

Я использую следующее

<a href="javascript:;" onclick="myJsFunc();">Link</a>

вместо

<a href="javascript:void(0);" onclick="myJsFunc();">Link</a>

Определенно хеш ( # ) лучше, потому что в JavaScript это псевдосхема:

1. загрязняет историю
2. создает новую копию движка
3. запускается в глобальном область действия и не уважает систему событий.

Конечно, [намного] лучше "#" с обработчиком onclick, который предотвращает действие по умолчанию. Более того, ссылка, единственная цель которой - запустить JavaScript, на самом деле не является «ссылкой», если только вы не отправляете пользователя на какой-нибудь разумный якорь на странице (просто # отправит наверх), когда что-то пойдет не так. Вы можете просто смоделировать внешний вид ссылки с помощью таблицы стилей и вообще забыть о href.

Кроме того, что касается предложения cowgod, особенно этого: ... href = "javascript_required.html" onclick = "... Это хороший подход, но не

] # лучше, чем javascript: something , но еще лучше:

HTML:

<a href="/gracefully/degrading/url/with/same/functionality.ext" class="some-selector">For great justice</a>

JavaScript:

$(function() {
    $(".some-selector").click(myJsFunc);
});

Вы всегда должны стремиться к постепенной деградации (в том случае, если у пользователя не включен JavaScript ... и когда это со спецификациями и бюджетом). Также считается дурным тоном использовать атрибуты и протокол JavaScript непосредственно в HTML.

В полном согласии с общим настроением, используйте void(0), когда вам это нужно, и используйте правильный URL, когда вам это нужно.

Используя переписывание URL, вы можете сделать URL, которые не только сделают то, что вы хотите сделать с отключенным JavaScript, но и скажут вам, что именно они собираются сделать.

<a href="./Readable/Text/URL/Pointing/To/Server-Side/Script" id="theLinkId">WhyClickHere</a>

На стороне сервера вам просто нужно разобрать URL и строку запроса и сделать то, что вы хотите. Если вы умны, вы можете позволить сценарию на стороне сервера по-разному реагировать на Ajax и стандартные запросы. Это позволит вам иметь лаконичный централизованный код, обрабатывающий все ссылки на вашей странице.

Учебники по переписыванию URL

Плюсы

• Отображается в строке состояния
• Легко обновляется до Ajax с помощью обработчика onclick в JavaScript
• Практически сам себя комментирует
• Не дает вашим каталогам засориться одноразовыми HTML-файлами

Минусы

• Все еще следует использовать event.preventDefault() в JavaScript
• Довольно сложная обработка путей и разбор URL на стороне сервера.

Я уверен, что есть еще масса минусов. Не стесняйтесь обсуждать их.