onclick="javascript:func()" vs. onclick="func()"

Question

Is there any difference between

<input type="submit" value="Register" onclick="javascript:submitTheForm();">

and

<input type="submit" value="Register" onclick="submitTheForm();">

Should I use javascript: before a JS function call?

on***** runs javascript without defining them a "javascript:" — Tobi, Apr 20 '12 at 08:17
Thanks! I know about handlers, just doubt about this case :) — Pat Wangrungarun, Apr 20 '12 at 08:22

ThiefMaster · Accepted Answer · 2012-04-20T08:23:16.747

javascript: inside an onwhatever="" handler is a no-op. The content of this attribute is always JavaScript so javascript: defines a label - but outside of a switch block or a loop (where you can use it to break/continue to the position of the label) it does nothing.

However, using inline event handlers is discouraged, there are better ways to register event handlers.

While not mentioned in the question, it's worth noting that using javascript: in the href attribute does work (and in there it is actually necessary) but is highly discouraged for various reasons:

this does not point to the element
Calling a function returning a value causes the browser to leave the site
Clicking the link with disabled JavaScript breaks
Trying to open the link in a new window/tab breaks

So, if you really have to use inline events, always use onclick="" etc. without javascript:.

You can use it also with `break` and any statement. It does not have to be used together with `switch`. — Felix Kling, Apr 20 '12 at 08:20

score 1 · Answer 2 · answered Apr 20 '12 at 08:16

1

When you are in a onclick attribute, you shouldn't use the javascript: prefix. This is usefull when you want a link <a /> to handle a JS function, for example:

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

answered Apr 20 '12 at 08:16

sp00m

47,968
31
142
252

2

`javascript:` URLs are bad. Not only do they break with disabled JavaScript but they also cause problems if the function returns a value. So better use a proper URL in the `href` (or `#` if the link does not have a non-js fallback) and `onclick` to run your javascript code (`return false;`/`preventDefault` to avoid loading the href of the link) – ThiefMaster Apr 20 '12 at 08:19
1

I agree with you. The question was about the `javascript:` prefix. – sp00m Apr 20 '12 at 08:21

score 1 · Answer 3 · edited May 23 '17 at 12:21

1

javascript:func() is using the javascript protocol so that it could be used in an anchors href attribute. However, don't do this see Why is it bad practice to use links with the javascript: “protocol”? for more information.

Event handlers are preferable to trigger events instead of attributes.

edited May 23 '17 at 12:21

Community

1
1

answered Apr 20 '12 at 08:19

detaylor

7,112
1
27
46

The OP asked about `onclick`, not about `href` – ThiefMaster Apr 20 '12 at 08:20
Anyway thanks about the related question! – Pat Wangrungarun Apr 20 '12 at 08:24
@ThiefMaster - true but he was also asking about script starting with `javascript:`. – detaylor Apr 20 '12 at 08:26

onclick="javascript:func()" vs. onclick="func()"

3 Answers3

Linked

Related