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 an entrepreneur and graduate in Computer science engineering, pretty cool chap, blogging since 2005. My interests are Machine learning, Parallel computing, Computer vision, PHP, Wordpress, Linux etc. I like to chill out with travels, video games and a cup of hot coffee. I am born in India, currently living in Budapest, Hungary. Feel free to contact me anytime!

Leave a Reply

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


8 + = eleven

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