stop page from jumping back to top when empty tag is clicked

Question

The title says it all, how would I make it using only html, no JAVASCRIPT, to stop the page from jumping back to the top if a user clicks on an empty tag? So for example, if at the very bottom of my site, I have a link that is empty, but click on it, it takes be clear back up to the top...

possible duplicate of [how to stop # links that call javascript functions from jumping to top of page](http://stackoverflow.com/questions/1150229/how-to-stop-links-that-call-javascript-functions-from-jumping-to-top-of-page) — Wesley Murch, Sep 15 '13 at 17:36
It's not supposed to jump anywhere...if I click on an empty link - I want it to stay put and not jump up to the top of the page. — user2732875, Sep 15 '13 at 17:40
@user2732875 Context matters here. What's the point of the link? Also, show your code; `` won't make the page jump, it will reload the current page. — Wesley Murch, Sep 15 '13 at 17:41
You stop it by removing the empty `` tag (whatever you mean by that). If you think you cannot remove it, you need to post a new question that explains what you are really doing (with relevant HTML and JavaScript included). — Jukka K. Korpela, Sep 15 '13 at 17:44

This Guy · Accepted Answer · 2015-11-22T21:27:13.293

A simple solution to this would simply put in the a tag:

<a href="#a">Title</a>

In doing this, it won't scroll your page back to the top. To have it scroll back to the top, take out the a after the # symbol...so it would look like this:

<a href="#">Title</a>

That is the best explanation I can give you without any code provided from you.

Give that a try and it should work with what you are asking for...No javascript is needed. In fact you can even make the #a jump to a different location if you'd like on your page :)

UPDATE:

This may suit you better! Add this to either a js file or add it inline with you html document.

Separate js file (just make sure to call it externally on your html file):

$('#Add_Your_Id_Or_Class_Here').removeAttr('href');

Example: $('#link a').removeAttr('href'); or $('.link a').removeAttr('href'); or even $('a').removeAttr('href');

Now, if you want to achieve this via inline on your html file, simply do this:

<script>
    $('#Add_Your_Id_Or_Class_Here').removeAttr('href');
</script>

Again, you can use any of the examples above as well. In fact there are many ways you can achieve this now that I think about it...Hope that helps :)

`href="#a"` is a hacky workaround, definitely not something that should be taught to beginners. (besides, `#a` might exist) — Wesley Murch, Sep 15 '13 at 17:37
This works perfectly! Thank you for the example - instead I'm using `Link` and in doing so, when I click on it, it stays put! -- Thank you again! — user2732875, Sep 15 '13 at 17:42
@Wesley Murch, I am kinda having a different problem. My question is at http://stackoverflow.com/q/37964120/3697102 — Ayan, Jun 23 '16 at 13:13

score 1 · Answer 2 · answered Sep 15 '13 at 18:03

1

If your link isn't supposed to be linked (such as when it's just a placeholder for where a link could be) then you should not add an [href] attribute to the <a> element

answered Sep 15 '13 at 18:03

zzzzBov

174,988
54
320
367

stop page from jumping back to top when empty tag is clicked

2 Answers2