“javascript:void(0)”是什么意思？


What does “javascript:void(0)” mean?

1
login

我见过很多次这样的href，但我不知道这到底是什么意思。

相关讨论

The void operator evaluates the given
expression and then returns undefined.

The void operator is often used merely
to obtain the undefined primitive
value, usually using"void(0)" (which
is equivalent to"void 0"). In these
cases, the global variable undefined
can be used instead (assuming it has
not been assigned to a non-default
value).

这里提供了一个解释：void操作符。

使用链接的href进行此操作的原因是，通常情况下，javascript:URL会将浏览器重定向到评估该javascript结果的纯文本版本。但如果结果是undefined，那么浏览器将保持在同一页上。void(0)只是一个简短的脚本，对undefined进行评估。

相关讨论

除了技术上的回答，javascript:void意味着作者做错了。

没有充分的理由使用javascript:伪URL(*)。在实践中，如果任何人尝试"书签链接"、"在新选项卡中打开链接"等操作，都会导致混淆或错误。现在人们已经习惯了用鼠标中键点击新标签：它看起来像一个链接，你想在一个新标签中读取它，但它实际上根本不是一个真正的链接，当鼠标中键点击时会产生不想要的结果，如空白页或JS错误。

是一种常见的替代方案，可以说它的坏处较小。但是，您必须记住来自您的onclick事件处理程序的return false，以防止跟踪链接并向上滚动到页面顶部。

在某些情况下，可能会有一个实际有用的地方来指向链接。例如，如果您有一个控件可以单击它打开以前隐藏的，那么使用链接到它是有意义的。或者如果有一种非javascript的方法来做同样的事情(例如，"thispage.php"？show=foo'将foo设置为可见，可以链接到它。

否则，如果一个链接只指向某个脚本，则它实际上不是一个链接，不应标记为链接。通常的方法是将onclick添加到、或没有href的中，并以某种方式设置样式以使您可以单击它。这就是StackOverflow[在编写时所做的；现在它使用href="#"。

这样做的缺点是，您会失去键盘控制，因为您不能在span/div/bare-a上制表或用空格激活它。这是否真的是一个缺点取决于元素打算采取什么样的行动。您可以尝试通过在元素中添加一个tabIndex，并监听空格键来模拟键盘的可交互性。但它永远不会100%重现真正的浏览器行为，尤其是因为不同的浏览器对键盘的响应不同(更不用说非可视浏览器)。

如果您真的想要一个不是链接但可以通过鼠标或键盘正常激活的元素，那么您需要的是一个

这意味着它什么也做不了。这是试图让链接不"导航"到任何地方。但这不是正确的方式。

实际上，在onclick事件中，您应该只使用return false，如下所示：

1
hello

通常，如果链接正在执行一些"javascript-y"操作，则使用该链接。比如发布一个Ajax表单，或者交换一个图像，等等。在这种情况下，您只需使任何函数被称为返回false。

然而，为了使你的网站完全棒极了，一般来说，如果浏览网站的人选择不运行javascript，你会包含一个执行相同操作的链接。

1
2
<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello
相关讨论

与javascript:void相比，""的行为有很大的不同。

""将您滚动到页面顶部而"javascript:void(0)；"没有。

如果要对动态页面进行编码，这一点非常重要。用户不想仅仅因为单击了页面上的链接而返回顶部。

相关讨论

这是一种非常流行的向HTML链接添加javascript函数的方法。例如：在许多网页上看到的[Print]链接是这样写的：

1
Print

为什么我们需要href，而单靠onclick就能完成这项工作？因为当用户在没有href的文本"print"上悬停时，光标将变为插入符号(&42351；)而不是指针(&128070；)。只有在a标记上有href才能将其作为超链接进行验证。

使用href="#"是href="javascript:void(0);"的一种替代方法。这个替代方案不需要在用户的浏览器中打开javascript，所以它更兼容。

相关讨论

您的a标签上应该始终有一个href。调用一个返回"undefined"的javascript函数就可以了。因此将链接到""。

Internet Explorer 6中没有href的定位标记不能应用a:hover样式。

是的，这是一种可怕的轻微的危害人类的罪行，但总体而言，Internet Explorer 6也是如此。

我希望这有帮助。

Internet Explorer 6实际上是一项危害人类的重大犯罪。

值得一提的是，在检查未定义时，有时会看到void 0，这仅仅是因为它需要更少的字符。

例如：

1
something === undefined

VS

1
something === void 0

因此，某些缩小方法将未定义替换为void 0。

相关讨论

void是用于返回undefined值的运算符，因此浏览器将无法加载新页面。

Web浏览器将尝试获取用作URL的任何内容并加载它，除非它是返回空值的javascript函数。例如，如果我们单击这样的链接：

1
Click Me

然后会出现一条不加载新页面的警告消息，这是因为alert是一个返回空值的函数。这意味着当浏览器试图加载一个新页面时，它会看到空值，并且没有要加载的内容。

关于void运算符需要注意的一个重要事项是，它需要一个值，不能由它自己使用。我们应该这样使用它：

1
I am a useless link
相关讨论

要理解这个概念，首先应该理解javascript中的void操作符。

void运算符的语法是：void ?expr?，它计算expr并返回undefined。

如果将void实现为一个函数，它看起来如下：

1
2
3
function myVoid(expr) {
    return undefined;
}

此void运算符有一个重要用法，即丢弃表达式的结果。

在某些情况下，重要的是返回未定义的，而不是表达式的结果。然后void可以用来丢弃这个结果。其中一种情况涉及到javascript:url，这对于链接应该避免，但对于书签很有用。当您访问其中一个URL时，许多浏览器会将当前文档替换为评估URL"内容"的结果，但前提是结果未定义。因此，如果要在不更改当前显示内容的情况下打开新窗口，可以执行以下操作：

1
javascript:void window.open("http://example.com/")
相关讨论

void运算符计算给定表达式，然后返回undefined。它避免刷新页面。

使用javascript:void(0)意味着HTML的作者错误地使用anchor元素来代替button元素。

Anchor tags are often abused with the onclick event to create
pseudo-buttons by setting href to"#" or"javascript:void(0)" to
prevent the page from refreshing. These values cause unexpected
behavior when copying/dragging links, opening links in a new
tabs/windows, bookmarking, and when JavaScript is still downloading,
errors out, or is disabled. This also conveys incorrect semantics to
assistive technologies (e.g., screen readers). In these cases, it is
recommended to use a

资料来源：MDN的页。

相关讨论

Web开发人员使用javascript:void(0)，因为它是防止a标记的默认行为的最简单方法。void(*anything*)返回undefined，它是一个不稳定的值。返回一个错误值就像EDOCX1中的return false，onclick事件中的a标记阻止了它的默认行为。

所以我认为javascript:void(0)是防止a标记的默认行为的最简单方法。

链接必须具有要指定的Href目标，才能使其成为可用的显示对象。

大多数浏览器不会在

1
<A HREF=""

标签如：

1
<A href="JavaScript:var elem = document.getElementById('foo');"

因为大多数浏览器中的href标签不允许空白，或者会将空白转换为%20，这是一个十六进制的空格，这使得你的javascript对解释器毫无用处。

因此，如果要使用a href标记来执行内联javascript，必须首先为href指定一个不太复杂(不包含空格)的有效值，然后在onclick、onmouseover、onmouseout等事件属性标记中提供javascript。

典型的答案是这样做：

1
<A HREF="#" onclick="var elem = document.getElementById('foo');">Get the object

这很好，但它会使页面跳到顶部，因为pound sign/hash标记告诉它这样做。

只需在a href标记中提供一个pound sign/hash标记，就可以实际指定根锚点，默认情况下，根锚点始终位于页面顶部，通过在a href标记中指定name属性，可以指定其他位置。

1
<A NAME='middleofpage'></A>

然后，您可以将a href标记更改为跳转到"middleofpage"，并在onclick事件中执行javascript，一旦发生这种情况：

1
<A HREF="#middleofpage" onclick="var elem = document.getElementById('foo');">Get the object

在很多时候，你不希望链接到处跳，所以你可以做两件事：

1
<A HREF="#thislinkname" name='thislinkname' onclick="var elem = document.getElementById('foo');">Get the object

现在，单击后它将无处可去，但它可能会导致页面从当前视区重新居中。这不漂亮。使用a href提供在线javascript的最佳方法是什么，但不必执行上述任何操作？javascript：空(0)；

1
<A HREF="JavaScript:void(0);" onclick="var elem = document.getElementById('foo');">Get the object

这会告诉浏览器什么也不去，而是先在href标记中执行有效的javascript:void(0)；函数，因为它不包含空白，并且不会被解析为URL。它将由编译器运行。void是一个关键字，当与0的Permeter一起提供时，它返回Undefined，它不使用任何其他资源来处理在不指定0的情况下将发生的返回值(它更易于内存管理/性能)。

接下来发生的事情是onclick被执行。页面不移动，显示时不会发生任何情况。

javascript:urls放在一边；这是void可以用来编写较短代码的地方。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
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
}
相关讨论

另一个使用javascript.void(0)的例子。我不确定这是不是正确的方法，但这项工作

1
2
3
4
5
6
7
8
9
10
11
12
13
$(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();
    }
  });
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<section>
 
   
      Room Dimensions
      <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>
     
        Living Room
        Dining Room
        Kitchen
        Master Bedroom
        Bedroom 2
        Bedroom 3
        Bathroom
        Gym
        Swimming Pool
     
     
       
       
       
       
       
       
       
       
       
     
   



</section>

相关讨论