Coding With Fun
Home Docker Django Node.js Articles Python pip guide FAQ Policy

void (0) in javascript; Usage and FAQ resolution


May 30, 2021 Article blog



Friends who have used ajax often see code such as here, where void is an operator that specifies that an expression is to be evaluated but does not return a value. J avascript:void(0) in some cases there will be bugs that are not compatible with the browser. Let's take a look at the basic introduction and usage of javascript:void(0), and then look at what problems will arise with it and how to fix it.

Tip: Before you learn something, you can learn or review what javascript:void(0) means!

The void operator usage format is as follows: j avascript:void (expression) \2. j avascript:void expression

expression is an expression of the Javascript standard to evaluate. T he parenthesis on the outside of the expression is optional, but it's a good habit to write about it. ( Implemented version Navigator 3.0)

You can specify a hyperlink using the void operator. T he expression is evaluated but nothing is loaded at the current document.

The following code creates a hyperlink when nothing happens to the user in the future. Void(0) is calculated as 0 when the user links, but has no effect on Javascript.

<A HREF="javascript:void(0)">单此处什么也不会发生</A>

The following code creates a hyperlink that submits the form when the user orders.

<A HREF="javascript:void(document.form.submit())">单此处提交表单</A>

The following code executes the subgo() function.

<a href="javascript:void(0)"onclick="subgo()">点我</a>

In this case, javascript:void(0), which doesn't really work, it's just a dead link, and the function executed is subgo().

<a href="#" onclick="subgo()">点我</a>

<ahref="javascript:void(0)" onclick="subgo()">点我</a>区别。
<a href="javascript:void(0)"onclick="javascript:history.back();">
返回</a>

href contains a location information. T he default anchor is the #top, which is the upper end of the page, which can cause the browser to slow down or even crash when you click this link quickly and continuously. J avascript:void(0) represents only a dead link, without any information. So it's best to use void(0) when calling the script

The difference between href and javascript:void(0).

The href-"" method actually means an empty connection, but it automatically jumps to the top of the page after clicking, because using this method is equivalent to clicking on an anchor, but the anchor does not write an ID, so it jumps to the top of the page by default. As can be seen from the example above, void (0) can be used when some processing is performed, but not the page is refreshed as a whole, but in cases where refreshing the page is required, be careful.

In fact, we can use this sentence will do a submit operation. Under what circumstances with void (0) more, no refresh, of course, Ajax, look at Ajax's web page, you will generally see a lot of void (0), so before using void (0), it is best to think about whether this page needs to be refreshed as a whole.

To be clear, the form of href=""" So if it's an empty connection, javascript:void(0) is recommended.

When the page has a scroll bar, clicking returns to the solution at the top of the page

There are several solutions:

1, click on the link and don't do anything

<a href="javascript:void(0);" >test</a> 
<a href="javascript:;" >test</a>
<a href="####" >test</a> //使用2个到4个#,见的大多是"####",也有使用"#all"等其他的

2, click on the link, in response to the user-defined click event

<a href="javascript:void(0)" onclick="doSomething()">test</a> 
<a href="#" onclick="doSomething();return false;">
什么问题都解决了,包括浏览器不兼容问题</a> //或者直接使用href=""
<a href="#" onclick="alert();event.returnValue=false;">test</a>

What problems do using javascript:void(0)?

Linking (href) using javascript:void(0) directly can cause problems in the IE, such as causing the gif animation to stop playing, etc., so the safest way is to use the word "" T o prevent clicking on a link and jumping to the top of the page, the onclick event return false is sufficient. If you just want to move the mouse over and turn it into a hand shape, you can use it.

We can use the void operator to specify hyperlinks, such as javascript:void (document.form.submit().) Expressions are evaluated but nothing is mounted at the current document, void(0) is evaluated as 0, but there is no effect on JavaScript, which means that the effect is the same.

Since it is easy to cause problems, why Sina Weibo, Taobao and other large stations of the home page JS operation of href are javascript:void (0); this?

 void (0) in javascript; Usage and FAQ resolution1

 void (0) in javascript; Usage and FAQ resolution2

A technical friend said he saw this https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void:

<a href=”void(0);” rel=”nofollow”>
Click here to do nothing
</a>
<a href=”void(document.body.style.backgroundColor=’green’);” rel=”nofollow”>
Click here for green background</a>

It could be javascript:void(0); This ensures that the return value is undefined, and that if the connection click requires some code to be processed, 0 can be replaced at any time.

Add js to href to prevent connections from jumping, previously using the hashtag , but jump back to the top of the page in some browsers. T hat's not good, so someone thought about adding the οnclick "return false" but the problem came up again, which would block the binding time, for example, when we used jquery. S o there is the use of href "javascript: void(0); " Writing, this practice is really written by some people who write c, because of writing habits. T hen someone said the void function was removed. T here is a more concise writing, in fact, when a is not connected can completely remove the href attribute or use other elements, just add a pointing mouse style on it. Depends on personal habits.

Solve the method under IE that uses the javascript:void(0) method to jump

In general, the A label under IE uses the onclick method, adding javascript:void(0) or javascript:;

The original code is as follows:

<a href="javascript:void(0)" title="关闭" onclick="delbook();">关闭</a>

or:

<a href="javascript:;" title="关闭" onclick="delbook();">关闭</a>

Jumps may occur in both of these methods.

But you'll find that javascript:void(0) or javascript:;

Solution:

<a href="javascript:void(0)" title="关闭" onclick="delbook();return false;">关闭</a>

or

<a href="javascript:void(0)" target="_self" title="关闭" onclick="delbook();">关闭</a>

Use return false; Javascript:void(0) can be blocked from executing.

You can prevent a page refresh from occurring because it is an empty function, using target-"_self" to prevent you from jumping to another page.

Of course, you can write directly in the case of target, "_self".

<a href="javascript:delbook()" target="_self" title="关闭">关闭</a>

Use the above workaround as long as there is a refresh or jump action in the page.

Several ways JS jumps: 1.

window.open(”url“) 

2. Use custom functions

<script> 
function openWin(tag,obj)
{
obj.target="_blank";
obj.href = "Web/Substation/Substation.aspx?stationno="+tag;
obj.click();
}
</script>
<a href="javascript:void(0)"onclick="openWin(3,this)">点我</a>

3.

window.location.href='';