HTML anchor tag with Javascript onclick event

Question

On using Google I found that they are using onclick events in anchor tags   In more option in google header part  it looks like normal a tag  but onclicking it doesn t get redirected but opened a menu  Normally when using   lt a href  more php  onclick  show more menu    gt More  gt  gt  gt  lt  a gt    It usually goes to  more php  without firing show more menu    but I have show a menu in that page itself  How to do like google

User · Answer

Use following code to show menu instead go to href addres

_x000D_

function show_more_menu(e) {_x000D_
  if( !confirm(`Go to ${e.target.href} ?`) ) e.preventDefault();_x000D_
}

_x000D_

<a href='more.php' onclick="show_more_menu(event)"> More >>> </a>

_x000D_

User · Answer

If your onclick function returns false the default browser behaviour is cancelled  As such    lt a href  http   www google com  onclick  return check    gt check lt  a gt    lt script type  text javascript  gt   function check         return false      lt  script gt    Either way  whether google does it or not isn t of much importance  It s cleaner to bind your onclick functions within javascript - this way you separate your HTML from other code

User · Answer

You can even try below option     lt a href  javascript show more menu     gt More  gt  gt  gt  lt  a gt

User · Answer

From what I understand you do not want to redirect when the link is clicked  You can do     lt a href  javascript    onclick  show more menu     gt More  gt  lt  a gt

[javascript] HTML anchor tag with Javascript onclick event

Examples related to javascript

Examples related to hyperlink

Examples related to onclick

Examples related to anchor