4

Expanding on this question,

For items that trigger dialogs and menus (i.e. non navigational), is it good practice to leave out the HREF attribute in links that have events that are hooked up via JavaScript? In these cases, does it makes sense to have HREF there at all?

From this: <a href="javascript://">some text</a>

Or even worse, this: <a href="#">some text</a> (which forces you to use event.preventDefault())

to this: <a>some text</a>

Community
  • 1
  • 1
Diodeus - James MacFarlane
  • 112,730
  • 33
  • 157
  • 176

3 Answers3

3

==Edited a little more==

Bad, bad idea. It wont show up as a link for one thing. If you need a button, but are use an <a> as one, just using a <button> or <input type="button">. As you said, "non-navigational". The entire point of <a> is navigational.

Out of those two tho, use href="#" putting javascript:// in a link is worse than adding inline styles.

Oscar Godson
  • 31,662
  • 41
  • 121
  • 201
2

Pragmatically - this is what I have learned over 16 years of JS

  1. have the href, if not you need to set the cursor to hand or pointer
  2. make the href go to a "sorry you need javascript" page if you do not want to use # or as I learned recently #somethingNotExisting
  3. NEVER have href="javascript:anything()"
  4. return false or preventDefault in the onclick which is preferably set in an onload handler

UPDATE: For menus and such, the agreed markup are lists with css and using links in such menus is recommended if the links actually loads content to gracefully degrade to plain html navigation if script is off

mplungjan
  • 169,008
  • 28
  • 173
  • 236
  • 1
    #1 is an awful practice You're styling by setting HTML attributes? Thats like suggesting wrapping text in an `` to color text blue. – Oscar Godson Sep 21 '11 at 19:55
  • Please read the FIRST WORD of my post. Yes I use the href to get all browsers to show a clickable item with the cursor set to the pointer used default by the the browsers. I cannot see ANY reason other than puritanism to the nth degree to insist on styling a clickable item using all sorts of browser dependant workarounds. The question was pertaining to links hooked up to javascript. It looks like a link, it behaves like a link, then why not use a link? Your example of using to get a blue text is plain silly. – mplungjan Sep 22 '11 at 06:37
  • Huh? All sorts of browser workarounds? Even IE6 supports the `cursor` property. What are you trying to get support on? IE4? And puritanism? I was merely saying _styling_ elements using _HTML_ is a bad idea. Just like we shouldnt use `` or `` anymore. Why is it a bad thing to only use CSS for styling? – Oscar Godson Sep 23 '11 at 06:20
  • So you find cursor:pointer;cursor:hand nice and simple? And I do not call it styling. And it is one of the very few shortcuts I take. – mplungjan Sep 23 '11 at 17:52
0

You should use the command element instead.

The command element represents a command that the user can invoke.

HTML5: Edition for Web Authors

This has the benefit of being semantically correct. There's at least one fork of html5shiv which 'enables' support for the element in older browsers.

Matthew
  • 15,464
  • 2
  • 37
  • 31