4

I have a gallery of photos with a next and previous button. If one of my javascript methods is broken for one reason or another when one of the buttons is clicked it will add a hash to the url i.e. www.google.com# . I know the hash can be given a div id to jump to that part of the page but when it's blank it jumps around my page a few times and I'm not sure what it's targeting. I thought of attempting to remove the hash from the url but then I'd have to ensure that on every action and that seems like bad practice. I would prefer if the hash just made no difference to the actions on the page.

JewrassicPark
  • 189
  • 1
  • 2
  • 12
  • 1
    A 'blank hash' will usually take your browser window to the top of the page. – putvande Nov 01 '13 at 13:49
  • Have a read through this : http://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false sounds like you need to prevent the default event. – Nick R Nov 01 '13 at 13:49
  • I'm aware of prevent default but if the hash in the anchor tag href is improper then that's easier to change then attaching handlers to prevent default for everything. My biggest problem is broken javascript so I don't wanna use js to solve it if I can avoid it. – JewrassicPark Nov 01 '13 at 13:59

3 Answers3

2

I guess Next And Prev button has <a href="#" ...</a> like markup. In this case you can add event listener to those links with jquery

$('#prev, #next').on({
    'click': function(e) {
         e.preventDefault();
     }
})

and avoid changing location by browser. Or in pure javascript:

document.querySelectorAll('#prev, #next').addEventListener('click', function(e) {
    e.preventDefault();
},false)
//Note: this code is not cross-browser
Glen Swift
  • 10,962
  • 14
  • 43
  • 73
2

Don't use href="#", it is improper.

Instead, use href="javascript:;" or a variant thereof (personally I use javascript:void(null);)
This explicitly states that the link does not go to another location, but is handled by JavaScript.

Niet the Dark Absol
  • 301,028
  • 70
  • 427
  • 540
  • This is what I was worried about. I know at some point it was all set to href='/' and now most of them are href='#' but changing it would probably be the easiest solution. – JewrassicPark Nov 01 '13 at 13:56
  • 4
    I don't see how `href="#"` would be "improper", it's just a link to a bookmark. Using `href="javascript:;"` doesn't tell the browser that a script is handling the action, it asks the script in the `href` for the location to navigate to. As the script has a value of `undefined`, the browser can't navigate anywhere. – Guffa Nov 01 '13 at 14:01
1

Don't use an anchor tag when you don't want to perform a navigation function. Use button

Adam
  • 41,349
  • 10
  • 58
  • 78