By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,317 Members | 1,313 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,317 IT Pros & Developers. It's quick & easy.

link/href that will not scroll to the top of the page

Jezternz
100+
P: 145
Okay, simple problem, probrabable simple answer.
I have <a href="#" onclick="javascript">Click Me</a>
So basicly I want an anchor to do some javascript wen its clicked, my problem is, whenever this link is pressed, because of the hash(#) the page is scrolled to the top. How can I make a link do nothing in html (ie leave the page position where it is) without it scrolling to the top of the page.

Thanks. Josh
Apr 25 '08 #1
Share this Question
Share on Google+
11 Replies


drhowarddrfine
Expert 5K+
P: 7,435
Just leave the href off, or remove the hash.
Apr 26 '08 #2

Jezternz
100+
P: 145
wow that simpl, I probrably shud have tried that lol, thanks. I think i have to leave the href on or I get validation errors.

Edit yeh neitehr of those work for me as
href="" sends the user back to domain.com when the actual page is domain.com/?p=news
and the removal of the href is not xhtml complient
Apr 26 '08 #3

Markus
Expert 5K+
P: 6,050
wow that simpl, I probrably shud have tried that lol, thanks. I think i have to leave the href on or I get validation errors.

Edit yeh neitehr of those work for me as
href="" sends the user back to domain.com when the actual page is domain.com/?p=news
and the removal of the href is not xhtml complient
Why not use like <span onclick=..> ? Or is that not valid?
Apr 26 '08 #4

Death Slaught
100+
P: 1,137
Or you could just do this:

[HTML]<a name="placeHolder">&nbsp;</a>

<br />

<a href="http://domain.com#placeHolder" onclick="insert JavaScript here">Text to click.</a>[/HTML]


Thanks, Death
Apr 26 '08 #5

gits
Expert Mod 5K+
P: 5,390
here is one more possibility:

Expand|Select|Wrap|Line Numbers
  1. <a href="javascript:return false;" onclick="alert('test');">Click Me</a>
or setting this during the execution:
Expand|Select|Wrap|Line Numbers
  1. <a href="#" onclick="alert('test'); this.href='javascript:return false;';">Click Me</a>
  2.  
it just replaces the hash with a javascript action that just returns false :) whatever this will be good for ... but it avoids to search for an anchor to jump to ...

kind regards
Apr 26 '08 #6

drhowarddrfine
Expert 5K+
P: 7,435
the removal of the href is not xhtml complient
It is not invalid.
Authors may also create an A element that specifies no anchors, i.e., that doesn't specify href, name, or id.
.
Apr 26 '08 #7

gits
Expert Mod 5K+
P: 5,390
It is not invalid. .
then this should be the preferred solution, since it reduces the overhead of all the other suggestions :) ?

kind regards
Apr 26 '08 #8

Jezternz
100+
P: 145
I think I will go with this one.
here is one more possibility:
[HTML]<a href="javascript:return false;" onclick="alert('test');">Click Me</a>[/HTML]
Thanks heaps guys, much apreciated.

Edit: Although this works properly I do get a javascript error message (if i click on the little error box thingo down the bottom of ie that says "return statement outside of function".. Any other ideas? :(
Apr 27 '08 #9

harshmaul
Expert 100+
P: 490
I think I will go with this one.


Thanks heaps guys, much apreciated.

Edit: Although this works properly I do get a javascript error message (if i click on the little error box thingo down the bottom of ie that says "return statement outside of function".. Any other ideas? :(
Expand|Select|Wrap|Line Numbers
  1. <a href="javascript:void" onClick="do some javascript magic">clcik here</a>
Apr 28 '08 #10

Jezternz
100+
P: 145
Expand|Select|Wrap|Line Numbers
  1. <a href="javascript:void" onClick="do some javascript magic">clcik here</a>
again thanks but still error, it shows "syntax error" :(
You would think there would be a simple answer for this, but none that work correctly so far.

Edit: This doesnt give errors for some reason even using return
Expand|Select|Wrap|Line Numbers
  1. <a href="#" onclick="retun dothis()">link</a>
where I just added "return false;" on the end of the function dothis

I apologize for any time I have wasted, thanks heaps guys.
May 1 '08 #11

P: 1
Hey, don't know if still need it but here you have for future references:

Expand|Select|Wrap|Line Numbers
  1. <a href="javascript: void(0)">
Feb 14 '12 #12

Post your reply

Sign in to post your reply or Sign up for a free account.