call javascript function on hyperlink click

Question

I am dynamically creating a hyperlink in the c  code behind file of ASP NET  I need to call a JavaScript function on client click  how do i accomplish this

User · Accepted Answer

Neater still  instead of the typical href     or href  javascript void  or href  whatever   I think this makes much more sense   var el   document getElementById  foo    el onclick   showFoo    function showFoo       alert  I am foo       return false      lt a href  no-javascript html  title  Get some foo   id  foo  gt Show me some foo lt  a gt    If Javascript fails  there is some feedback  Furthermore  erratic behavior  page jumping in the case of href      visiting the same page in the case of href     is eliminated

User · Answer

Use the onclick HTML attribute      The onclick event handler captures a   click event from the users    mouse   button on the element to which the   onclick attribute is applied  This   action usually results in a call to a   script method such as a JavaScript   function

User · Answer

I prefer using the onclick method rather than the href for javascript hyperlinks  And always use alerts to determine what value do you have    lt a href     onclick  jsFunction   alert  it works      gt Link lt  a gt   It could be also used on input tags eg    lt input type  button  value  Submit  onclick  jsFunction   alert  it works      gt

User · Answer

The simplest answer of all is      x000D   x000D   lt a href  javascript alert  You clicked     gt My link lt  a gt  x000D   x000D   x000D    Or to answer the question of calling a javascript function    x000D   x000D   lt script type  text javascript  gt  x000D  function myFunction myMessage    x000D      alert myMessage   x000D    x000D   lt  script gt  x000D   x000D   lt a href  javascript myFunction  You clicked     gt My link lt  a gt  x000D   x000D   x000D

User · Answer

If you do not wait for the page to be loaded you will not be able to select the element by id  This solution should work for anyone having trouble getting the code to execute    lt script type  text javascript  gt  window onload   function         document getElementById  delete   onclick   function    myFunction          function myFunction               your code goes here         alert  Alert message here              lt  script gt    lt a href     id  delete  gt Delete Document lt  a gt

User · Answer

The JQuery answer  Since JavaScript was invented in order to develop JQuery  I am giving you an example in JQuery doing this    lt div class  menu  gt       lt a href  http   example org  gt Example lt  a gt       lt a href  http   foobar com  gt Foobar com lt  a gt   lt  div gt    lt script gt  jQuery   div menu a         click function             do the click  this href            return false              play the funky music white boy function do the click  url         alert  url       lt  script gt

User · Answer

I would generally recommend using element attachEvent  IE  or element addEventListener  other browsers  over setting the onclick event directly as the latter will replace any existing event handlers for that element   attachEvent   addEventListening allow multiple event handlers to be created

User · Answer

With the onclick parameter      lt a href  http   www google com  onclick  myJavaScriptFunction     gt mylink lt  a gt

User · Answer

Ideally I would avoid generating links in you code behind altogether as your code will need recompiling every time you want to make a change to the  markup  of each of those links  If you have to do it I would not embed your javascript  calls  inside your HTML  it s a bad practice altogether  your markup should describe your document not what it does  thats the job of your javascript   Use an approach where you have a specific id for each element  or class if its common functionality  and then use Progressive Enhancement to add the event handler s   something like    c  example only probably not the way you re writing out your js  Response Write   lt a href    link for javascriptDisabled Browsers aspx   id   uxAncMyLink   gt My Link lt  a gt       Javascript    document getElementById  uxAncMyLink   onclick   function e       do some stuff here      return false          That way your code won t break for users with JS disabled and it will have a clear seperation of concerns   Hope that is of use

[javascript] call javascript function on hyperlink click

Examples related to javascript

Examples related to hyperlink