Thursday, May 28, 2009

Calling JavaScript Function from hyper link

While working on my project, i was thinking of a way to inform a user to click on a certain link before clicking on a particular. So, Javascript was an option to do that now the question arises

How to execute a java script function by clicking on link?



first thing i do is call the function after the href tag like
<a href="funciton_call();"> but this does not work...
first i was getting syntax error than i don't know what i did i started getting

permission denied

403 error....

then i have to call my might

Google

to rescue me out of this situation...

Google gave me couple of articles related to this issue but there is one article that explain the lots ways of achieving this or why use Javascript in this post i like to summarize article " Links & Javascript living together in harmony" by Jeff Howden.


To ways to open a link in a new window




  • <a href="#" onclick="window.open('somedoc.html', 'newWindow')" >click here</a>
    Howden J. 2002,"Links & JavaScript Living Together in Harmony",sydney,29-05-09,http://www.evolt.org/node/20938

  • calling by pseudo-protocol method

    <a href="JavaScript:window.open('somedoc.html', 'newWindow')">click here</a>
    Howden J. 2002,"Links & JavaScript Living Together in Harmony",sydney,29-05-09,http://www.evolt.org/node/20938



calling by pseudo-protocol method cause a line break if user try to open a web-page in a new window by doing shift+click .

In this article author explains the implication arises from using these methods.he said if you disable java script the first method will cause the browser to jump to the top of document and second method does nothing.

Another way to open a new window for non-Javascript user is?



<a href="somedoc.html" target="newWindow" >click here</a>

and if user want to open a pop up window, he can do this by using onclick event

<a href="somedoc.html" target="newWindow" onclick="window.open(this.href, this.target); return false"
>click here</a>
Howden J. 2002,"Links & JavaScript Living Together in Harmony",sydney,29-05-09,http://www.evolt.org/node/20938


Calling a function from a href tag for javascript compatible browser



<a
href="js_required.html" onmouseover="window.status = 'click here'; return true;"
onmouseout="window.status = '';" onclick="myFunction(); return false;"
>click here</a>

Calling a function from a href tag for non-javascript compatible browser



<a
href="js_required.html"
onmouseover="window.status = 'click here'; return true;" onmouseout="window.status = '';" onclick="return myFunction()">click here</a>
Howden J. 2002,"Links & JavaScript Living Together in Harmony",sydney,29-05-09,http://www.evolt.org/node/20938

No comments:

Post a Comment