What is the correct syntax with <a.... and onclick / javascript

Hello,
I need to make a link that will call a javascript function with AJAX.
I don't want to use <a href="#"... because it go to the top of the page.
I need something like this:
<a onClick="javafunction()" href=????>xxxxx</a>
without the href, it is not clickable as you know.
With the #, it go the top => Not good.
I heard about something like <a href="javascript:javafucntion()"..... it does not seem to work   and been told that it's a wrong way to call a function.
Someone can help me about this ????
Some explanation also ?
Many thanks.
bruno_boccaraAsked:
Who is Participating?
 
alien109Commented:
probably the best method is

<a href="#" onclick="function();return false;">link</a>
0
 
erikTsomikSystem Architect, CF programmer Commented:
can you just create a div and apply onClick event to it
0
 
hard2u2001Commented:
You can do it easily by:

<a onClick="javafunction()" href="javascript:void(0);">xxxxx</a>
 
//OR
 
<a href="javascript:javafunction();">xxxxx</a>
 
//both will work fine

Open in new window

0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
erikTsomikSystem Architect, CF programmer Commented:
this the correct syntax
<a href="javascript:welcomepage();" title="Welcom">text</a>
0
 
alien109Commented:
if you return false from the onclick function, your page will not jump to the top of the page.

using href="javascript:.... can fire the event twice in some browsers

also, if you provide an acutal url in the href for the link, you can have unobtrusive javascript.
0
 
hard2u2001Commented:
There was a comment by author as below:

"without the href, it is not clickable as you know.
With the #, it go the top => Not good."

it clearly means that he doesn't want to keep "#" on href.

And I also personally dont like that as it jumps to the top of the page.

and I have used
href="javascript:void(0);" in almost all of my site and it works fine atleast in

FF, IE(All versions), Safari(Mac and Win), Opera, and Flock.

Any other browsers then this I haven't tested.
0
 
alien109Commented:
hard2u2001 - Read my post.

If the handler function returns false, it will prevent the browser from navigating to the link. In other words, the page will not scroll to the top. Event handling 101.
0
 
hard2u2001Commented:
Ok buddy got ur point.
Didn't wanted  be rude here...

But I still can't agree with ur this statement
"using href="javascript:.... can fire the event twice in some browsers"

coz that works fine for me always.

nodoubt if u write like

<a onClick="javafunction()" href="javascript:anotherFunction(0);">xxxxx</a>

then it will fire both the functions...



0
 
bruno_boccaraAuthor Commented:
I checked in different forums and it seems to be the best method.
Many Thanks to alien and to everyone who tried to help me.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.