CODEWITHSUNDEEP
javascripthtml
robin
robin

Reputation: 1925

HTML Anchor tag issue

I have a piece of code like below

<div>
<ul>
<li><a href="">Test1</a></li>
-------
-------
-------
<li><a href="">Test46</a></li>
</div>

It displays the html page with 46 links. The issue is when i scroll down and select the 46th or the ones just above this the page is going back to the top again. why is it happening so and is there any way to prevent it ?

Upvotes: 1

Views: 400

Answers (3)

Spencer Wieczorek
Spencer Wieczorek

Reputation: 21565

An empty string in the href attribute <a href=""> means in modern browsers to go to the current page. This will basically just reload the current page, and as such it will go to the top.

One way to prevent from going to the top is to use href="javascript:void(0)", as mentioned by @Manwal or you can simply remove the href attribute completely (note in that case it will not show up as a clickable hyper-link).

Upvotes: 0

Quentin
Quentin

Reputation: 943124

href="" contains the URL "" which is a relative URL that resolves to "the URL of the current page".

When you click on the link, the browser follows it and goes to the current page.

As is normal (absent of any specific directive otherwise), when it goes to a page, it starts at the top.

If you don't want to link to the page: Why are you using a link in the first place?

If you just want something to dangle JavaScript from, use a button instead.

<button type="button">Test46</button>

You can style it to remove the default background colour and border, and set the colour scheme to match that of a link if you want it to look like a link.

Upvotes: 0

Manwal
Manwal

Reputation: 23816

href is blank thats why its going at top. You can use this instead of keeping blank:

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

Upvotes: 1

Related Questions