Что означает "javascript:void(0)"?

<a href="javascript:void(0)" id="loginlink">login</a>

Я'видел такие href много раз, но я'не знаю, что именно это значит.

Комментарии к вопросу (4)
Решение

Оператор void оценивает данное выражение и затем возвращает undefined.

Оператор void часто используется просто для того. для получения примитива undefined значения, обычно используя "void(0)" (что эквивалентно "void 0"). В этих случаях глобальная переменная undefined может быть использована вместо нее (при условии, что она не была присвоена переменной не по умолчанию значение).

Объяснение приведено здесь: оператор void.

Причина, по которой вы хотите сделать это с href ссылки, заключается в том, что обычно URL javascript: перенаправляет браузер на текстовую версию результата оценки этого JavaScript. Но если результат будет undefined, то браузер останется на той же странице. void(0) - это просто короткий и простой сценарий, который оценивается в undefined.

Комментарии (26)

In addition to the technical answer, javascript:void means the author is Doing It Wrong.

There is no good reason to use a javascript: pseudo-URL(*). In practice it will cause confusion or errors should anyone try things like ‘bookmark link’, ‘open link in a new tab’, and so on. This happens quite a lot now people have got used to middle-click-for-new-tab: it looks like a link, you want to read it in a new tab, but it turns out to be not a real link at all, and gives unwanted results like a blank page or a JS error when middle-clicked.

<a href="#"> is a common alternative which might arguably be less bad. However you must remember to return false from your onclick event handler to prevent the link being followed and scrolling up to the top of the page.

In some cases there may be an actual useful place to point the link to. For example if you have a control you can click on that opens up a previously-hidden <div id="foo">, it makes some sense to use <a href="#foo"> to link to it. Or if there is a non-JavaScript way of doing the same thing (for example, ‘thispage.php?show=foo’ that sets foo visible to begin with), you can link to that.

Otherwise, if a link points only to some script, it is not really a link and should not be marked up as such. The usual approach would be to add the onclick to a <span>, <div>, or an <a> without an href and style it in some way to make it clear you can click on it. Именно так поступал StackOverflow [на момент написания статьи; сейчас он использует href="#"].

Недостатком этого является то, что вы теряете контроль клавиатуры, так как вы не можете нажать табуляцию на span/div/bare-a или активировать его пробелом. Является ли это недостатком на самом деле, зависит от того, для каких действий предназначен элемент. Можно, приложив некоторые усилия, попытаться имитировать взаимодействие с клавиатурой, добавив tabIndex к элементу и ожидая нажатия клавиши Space. Но это никогда не сможет на 100% воспроизвести реальное поведение браузера, не в последнюю очередь потому, что разные браузеры могут по-разному реагировать на клавиатуру (не говоря уже о невизуальных браузерах).

Если вам действительно нужен элемент, который не является ссылкой, но может быть активирован обычным образом с помощью мыши или клавиатуры, то вам нужен `(или<input type="button">` - для простого текстового содержимого). При желании вы всегда можете использовать CSS для изменения стиля, чтобы он больше походил на ссылку, чем на кнопку. Но поскольку она ведет себя как кнопка, именно так ее и следует обозначать.

(*: во всяком случае, при создании сайтов. Очевидно, что они полезны для букмарклетов. javascript: псевдо-URL - это концептуальная странность: локатор, который не указывает на местоположение, а вместо этого вызывает активный код внутри текущего местоположения. Они вызвали огромные проблемы безопасности как для браузеров, так и для веб-приложений, и не должны были быть изобретены Netscape).

Комментарии (14)

Это означает, что это ничего не даст. Это попытка сделать так, чтобы ссылка никуда не "переходила". Но это не правильный способ.

На самом деле вы должны просто возвращать false в событии onclick, как показано ниже:

<a href="#" onclick="return false;">hello</a>

Обычно это используется, если ссылка выполняет какую-то "JavaScript-штуку". Например, размещает AJAX-форму, или меняет изображение, или что-то еще. В этом случае вы просто заставляете вызываемую функцию возвращать false.

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

<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello</a>
Комментарии (17)

Есть огромная разница в поведении и"#" и против код JavaScript:недействительным

и"#" и свитки вы в верхней части страницы а на "код JavaScript:недействительным(0);" не.

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

Комментарии (4)

Это очень популярный метод добавление функции JavaScript к HTML-ссылки.<БР>например: [печать] ссылки, которые вы видите на многих веб-страницы пишутся так:

<a href="javascript:void(0)" onclick="callPrintFunction()">Print</a>

Зачем нужны Солар а щелчку в одиночку может сделать работу? Потому что при наведении курсора на текст 'принт' когда там's нет близко, то курсор изменится на курсор (ꕯ) вместо указателя (👆). Только имея Солар на а тег проверяет ее как гиперссылку.

Альтернативу я с href="и код JavaScript:недействительным(0);&;, использование с href=" и#то". Эта альтернатива не'т требуют Javascript должен быть включен в пользовательский'с браузера, так как она совместима.

Комментарии (5)

В тегах a всегда должна быть ссылка href. Вызов функции JavaScript, которая возвращает 'undefined', подойдет как нельзя лучше. Также как и ссылка на '#'.

Теги якоря в Internet Explorer 6 без href не получают стиль a:hover.

Да, это ужасно и является небольшим преступлением против человечества, но опять же, как и Internet Explorer 6 в целом.

Надеюсь, это поможет.

Internet Explorer 6 на самом деле является крупным преступлением против человечества.

Комментарии (0)

Это's стоит отметить, что вы'будете иногда видеть недействительными 0 при проверке определено, просто потому, что он требует меньше символов.

Например:

something === undefined

и

something === void 0

Некоторые методы минификации замены неизвестной с недействительными 0 по этой причине.

Комментарии (2)

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

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

<a href="javascript: alert('Hello World')">Click Me</a>

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

Важная вещь, чтобы отметить о оператор Void является то, что он требует значения и не может быть использован сам по себе. Мы должны использовать его как это:

<a href="javascript: void(0)">I am a useless link</a>
Комментарии (3)

Использование код JavaScript:недействительным(0) означает, что автор в HTML злоупотребляет анкерный элемент на место элемента button.

теги якоря часто злоупотребляют с события onclick для создания псевдо-кнопок, параметр href, то, чтобы "#" или "код JavaScript:недействительным(0)" на не допустить страницы с освежающим. Эти значения привести к неожиданным поведение при копировании/перетаскивании ссылки, открытие ссылки в новом вкладок/окон, закладок, и, когда JavaScript загрузки, и GT; ошибок, или отключен. Это также передает неправильной семантике ассистивные технологии (например, чтения с экрана). В этих случаях рекомендуется использовать в <кнопка> вместо этого. В общем, вы должны использовать только якоря для навигации используете правильный URL-адрес.

Источник: МДН'ы <и> страницы.

Комментарии (2)

Чтобы понять эту концепцию, следует сначала понять оператор Void в JavaScript.

Синтаксис для оператора пустота: пустота «выражение», по которым оценивает выражение и возвращает undefined.

Если вы реализуете пустоту как функция, то она выглядит следующим образом:

function myVoid(expr) {
    return undefined;
}

Этот оператор Void имеет одно важное использование, которое отбрасываем результат выражения.

В некоторых ситуациях важно, чтобы возвращать undefined в отличие от результата выражения. Тогда пустота может быть использован, чтобы отменить результат. Одна такая ситуация связана с JavaScript: URL-адреса, которые следует избегать ссылок, но полезны для букмарклеты. Когда вы посетите один из этих URL-адресов, многие браузеры заменить текущий документ с результатом вычисления адресов “содержание”, но только если результат не определен. Поэтому, если вы хотите открыть новое окно без изменения отображаемого контента, вы можете сделать следующее:

javascript:void window.open("http://example.com/")
Комментарии (5)

В пустоту оператор вычисляет выражение и возвращает значение undefined. Это позволяет избежать перезагрузки страницы.

Комментарии (0)

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

Поэтому я думаю, что код JavaScript:недействительным(0) является простым способом, чтобы предотвратить поведение по умолчаниюа` тег.

Комментарии (0)

Ссылка должна иметь цель href Для быть определена, чтобы позволить ему быть объектом полезной дисплея.

Большинство браузеров не будет разбирать расширенный JavaScript в

Комментарии (0)

На JavaScript: URL-адреса в сторону, где пустота может быть полезно писать более короткий код.

var error1 = false,
    error2 = false,
    error3 = false;

function error1() {

  error1 = true;
}

function myFunction() {

  // You can easily return and call a function at once, if you don't care about myFunction's return value
  if (!someCondition1)
    return error1();

  // What if you want to set a value first?
  if (!someCondition2) {
    error2 = true;
    return
  }

  // Shortest way to return and set a value at once
  if (!someCondition3)
    return void(error3 = true);

  // More code goes here
}
Комментарии (1)

Другой пример, где используется в JavaScript.пустота(0) . Я'м не уверен, является ли это правильный способ, но работает

в

$(document).ready(function() {
  jQuery(".show-hide-detail").hide();
  jQuery(".show-hide-detail:first").show();
  jQuery(".show-hide-btn a").click(function() {
    var thid_data = jQuery(this).attr('data-id');
    jQuery(".show-hide-btn a").removeClass('active');
    jQuery(this).addClass('active');
    if (!jQuery("#" + thid_data).is(":visible")) {
      jQuery(".show-hide-detail").hide();
      jQuery("#" + thid_data).show();
    }
  });
});
<section>
  <div class="features">
    <div class="container">
      <h1>Room Dimensions</h1>
      <p class="description">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tempor arcu non ligula convallis, vel tincidunt ipsum posuere.sollicitudin. Duis iaculis, arcu ut hendrerit pharetra, elit augue pulvinar magna
      </p>
      <div class="dimension-btn show-hide-btn">
        <a class="active" data-id="LivingRoom">Living Room</a>
        <a href="javascript:void(0)" data-id="DiningRoom">Dining Room</a>
        <a href="javascript:void(0)" data-id="Kitchen">Kitchen</a>
        <a href="javascript:void(0)" data-id="MasterBedroom">Master Bedroom</a>
        <a href="javascript:void(0)" data-id="Bedroom2">Bedroom 2</a>
        <a href="javascript:void(0)" data-id="Bedroom3">Bedroom 3</a>
        <a href="javascript:void(0)" data-id="Bathroom">Bathroom</a>
        <a href="javascript:void(0)" data-id="Gym">Gym</a>
        <a href="javascript:void(0)" data-id="SwimmingPool">Swimming Pool</a>
      </div>
      <div class="row">
        <div class="LivingRoom Dimension-detail show-hide-detail" id="LivingRoom" style="display: block;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="DiningRoom" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="Kitchen" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="MasterBedroom" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="Bedroom2" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="Bedroom3" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="Bathroom" style="display: none;"></div>
        <div class="LivingRoom Dimension-detail show-hide-detail" id="SwimmingPool" style="display: none;"></div>
        </div>
      </div>
    </div>

</section>

в

Комментарии (1)