Fix-> JQuery onclick browser jumps to top of page!

JQuery onclick jumps to top of page

i had an issue with jquery code where i have a html link doing specific tasks for onclick event. Since the appear on bottom of my page, when i click on the link the browser jumps to top of the page every time i click.

<a href="#" onclick="dofunct()">click me</a>

This is really very frustrating as everytime i click a link, the browser jumps to top of page. After a long search, i fixed the problem by replacing # with javascript void function.

<a href="javascript:void(0);" onclick="dofunc()">click me</a>

It neatly solved my jump problem!

Similar Posts:

Tags:

Prabhu Balakrishnan

I am cool and friendly internet entreprenur blogging since 2005. My interests are wordpress, PHP, linux servers, SEO and travel. Besides computers, i am crazy for video games, travel and a cup of hot coffee! I am born in Coimbatore, India but i currently live in Budapest, Hungary. Feel free to contact me folks!

Leave a Reply

Your email address will not be published. Required fields are marked *


8 − four =

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Please wrap all source codes with [code][/code] tags. Powered by
  1. Dave H

    Here is another solution:

    click me

    Returning false prevents the default action of the item you clicked on. I found your solution and this one while trying to solve the same problem. I like this better because you won’t have the ‘javascript:void(0)’ showing up in the bottom corner of your browser when you hover over the link.

    Reply
  2. Ricardo Zea

    I while back I read that using ‘javascript:void(0);’ was not a best practice.

    Instead you can fix this problem by adding ‘return false;’ to your code, which is a more scalable way of fixing this problem.

    IE:

    $(‘#container’).click(function () {
    $(‘#element’).show();
    return false;

    More info in this other post: http://stackoverflow.com/questions/976753/jquery-click-brings-me-to-top-of-page-but-i-want-to-stay-where-i-am

    Reply
  3. Dan McKenzie

    Thank you both – I went with “return false;”, but each option would suffice for my need. Very easy to find solution in Google.

    Reply
  4. Kumar

    javascript:void(0) worked perfectly in all the cases even though it is not a best pratice. How ever return false will work if you are not returning anything in your function.
    In my case my function is returning a value so had to use javascript:void(0).
    Thanks for the good trick.

    Reply