0

Okay so this one has some similar threads but I couldn't find anything that nailed it on the head, so here we go.

I'm trying to simulate a link using the anchor tag, like so:

<a onClick="javascript: DownloadPorn();">Click Here!</a>

All of this works fine and dandy; the link shows, I can click it, and my javascript method is successfully executed.

The question here, is how can I correctly force the link to display in the 'same manner' as an actual 'HTML Link'? Or rather, in the 'same manner' as if I were to have an href in the above mentioned tag; like so:

<a href="#" onClick="javascript: DownloadMorePorn();">Click Here!</a>

Now... THIS Code snippet forces the link to display in the manner that I expect it to, but in using this method, when a link is clicked, the scroll location is bounced back to the top.

It's probably clear, that this is not an intended behavior for the framework I am trying to develop. If anyone has any suggestions to overcome this particular issue, I would greatly appreciate your input.

--- While typing this all up, I considered that I could place a static anchor at the top of the screen( say 0,0 or -,- ), and force all of my links to reference that anchor. If anyone sees any viability in this solution, I'm likely to explore it.

--- Edited ---

Accepted Answer:

In order to have an anchor behave as a hyperlink, without manipulating the browsers current position; utilize a Javascript method returning nothing(?) in the href attribute, or a valid return of 'false' in one of the alternate event handlers for an anchor, I.E. the onClick method.

Possible solutions:

<a href="javascript: DoSomething();">Link</a>
<a href="javascript: void(0);" onClick="javascript: DoSomething();">Link</a>
<a href="#" onClick="javascript: DoSomething(); return false;">Link</a>

Thanks again, everyone.

--- End Edit ---

3
  • 1
    "how can I correctly force the link to display in the 'same manner' as an actual 'HTML Link'?" Do you mean in the status bar?
    – j08691
    Dec 12, 2012 at 18:13
  • I'm not sure how the method name is relevant... And I meant from the clients perspective on mouse over, j08691. And why can't I thank people ahead of time -_- Dec 12, 2012 at 18:16
  • Nobody here has a sense of humor. PUT THE KEYBOARD DOWN! Dec 12, 2012 at 18:19

3 Answers 3

1

If you use return false at the end of your onclick attribute it will not make it scroll anywhere.

<a href="#" onClick="someFunc(); return false;">Click Here!</a>

or you can make your function return false, and return its result (false) as well as execute it in the onclick attribute, which is shorter:

<script type="text/javascript">
function someFunc() {
    // all your function code here
    return false;
}
</script>
<a href="#" onClick="return someFunc()">Click Here!</a>
0
1

Set the javascript function to the href.

<a href="javascript:DownloadPorn();">Click Here!</a>

Edit: Just to note some consider this bad practice.

2
  • 2
    The problem with this is if you set the click event handler via Javascript instead of inline, you'll end up with both an onclick handler and the href calling the function. The other problem with this is you don't have a reference to the object with this unlike the onclick handler. You can't pass anything about the object.
    – MrCode
    Dec 12, 2012 at 18:18
  • So in effect this still achieves what I intended to, but with less extensibility. ( How is extensibility not a word... ) Dec 12, 2012 at 18:33
1

Set the href to javascript:void(0);, this will mean the browser displays the link as if it had a real href:

<a href="javascript:void(0);" onClick="javascript: DownloadBooks();">Click Here!</a>

There are other methods such as setting the href to #, but the advantage of the one shown is that you don't have to worry about returning false or specifying return DownloadBooks().

This question has some good info about the use of javascript:void(0).

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.