CODEWITHSUNDEEP
javascriptjqueryhyperlinkpage-refresh
Roobah
Roobah

Reputation: 321

html hyperlink <a> with no refresh

the a tag is used in Jquery dropdown menus and generally in ajax . But the problem it refeshes the page . How can I force it not to refresh ?

Thanks,

Upvotes: 2

Views: 7829

Answers (4)

user3310620
user3310620

Reputation: 61

Just add javascript:void(0) in href

Example: <a href="javascript:void(0)">Home</a>

Upvotes: 6

Paul Alan Taylor
Paul Alan Taylor

Reputation: 10680

I had a similar issue, and did this to resolve.

  1. Remove the href attribute. Many people will set it to "#" because "it doesn't go anywhere". Not entirely true. It'll take you to the top of the page, which is a pain when you have a scrolling page.
  2. Unfortunately, removing the href tag will remove the normal rules for your mouse pointer. If you want the cursor to change when someone mouses over it, style your href-less a tags with :-

cursor : pointer

If you do those two things, your a tags won't go anywhere, won't scroll the screen and will look like regular links when a user mouses over them.

Upvotes: 0

Adam Pope
Adam Pope

Reputation: 3274

Use e.preventDefault() in the click handler and return false;.

Upvotes: 7

Noufal Ibrahim
Noufal Ibrahim

Reputation: 72755

You can add a handler for the click event on your anchors which after doing its work (executing and processing an Ajax request) returns False. This will prevent the event from propagating and calling the default handler (which is to GET the resource referred to by href).

Upvotes: 1

Related Questions