javascript tutorial - [Solved-5 Solutions] “javascript:void(0)” - javascript - java script - javascript array
Problem:
What does “javascript:void(0)” mean ?
Solution 1:
- The
voidoperator evaluates the given expression and then returnsundefined. - The
voidoperator is often used merely to obtain theundefinedprimitive value, usually using “void(0)” (which is equivalent to“void 0”). In these cases, the global variableundefinedcan be used instead (assuming it has not been assigned to a non-default value). - An explanation is provided here:
void operator. - The reason we’d want to do this with the
hrefof a link is that normally, ajavascript:URL will redirect the browser to a plain text version of the result of evaluating that JavaScript. But if the result isundefined, then the browser stays on the same page.void(0)is just the smallest script possible that evaluates asundefined.
Solution 2:
- 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 toreturn falsefrom youronclickevent 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
onclickto a<span>,<div>, or an<a>without anhrefand style it in some way to make it clear you can click on it. Now it useshref="#"]. - The disadvantage of this is that you lose keyboard control, since you can't tab onto a span/div/bare-a or activate it with space. Whether this is actually a disadvantage depends on what sort of action the element is intended to take. You can, with some effort, attempt to mimic the keyboard interactability by adding a
tabIndexto the element, and listening for a Space keypress. But it's never going to 100% reproduce the real browser behaviour, not least because different browsers can respond to the keyboard differently (not to mention non-visual browsers). - If you really want an element that isn't a link but which can be activated as normal by mouse or keyboard, what you want is a
<button type="button">(or<input type="button">is just as good, for simple textual contents). You can always use CSS to restyle it so it looks more like a link than a button, if you want. But since it behaves like a button, that's how really you should mark it up.
Solution 3:
<a href="#" onclick="return false;">hello</a>click below button to copy the code. By JavaScript tutorial team
- Typically it’s used if the link is doing some ‘JavaScript-y’ thing. Like posting an AJAX form, or swapping an image, or whatever. In that case you just make whatever function is being called return
false. - To make your website completely awesome, however, generally you’ll include a link that does the same action, if the person browsing it chooses not to run JavaScript.
<a href="backup_page_displaying_image.aspx"
onclick="return coolImageDisplayFunction();">hello</a>click below button to copy the code. By JavaScript tutorial team
Solution 4:
- There is a HUGE difference in the behaviour of "#" vs javascript:void
- "#" scrolls you to the TOP of the page while "javascript:void(0);" does not.
- This is very important if you are coding dynamic pages. the user does not want to go back to top just because he clicked a link on the page.
Solution 5:
It is used very popularly to add js functions to the html link, for example: the [Print] link that you see on many webpages. Code is like:
<a href="javascript:void(0)" onclick="call print function">Print</a>