W3C home > Mailing lists > Public > w3c-wai-gl@w3.org > July to September 2005

Re: [TECHS] Use of anchor tags to invoke JavaScript

From: Matt May <mcmay@bestkungfu.com>
Date: Tue, 16 Aug 2005 23:33:16 -0700
Message-ID: <4302DA2C.8090707@bestkungfu.com>
To: Becky_Gibson@notesdev.ibm.com
CC: w3c-wai-gl@w3.org

Becky_Gibson@notesdev.ibm.com wrote:

>
> Common accessibility practice has said that JavaScript URIs should not 
> be used. For example, <a href="javascript:doSomething();" >Action 
> Link</a>, will do nothing if JavaScript is not available.   Now that 
> WCAG 2.0 is providing for baselines that assume JavaScript is 
> available and enabled, a discussion of JavaScript URIs and invoking 
> JavaScript from an anchor link becomes relevant.   While the DHTML 
> Roadmap technologies remove the need to use anchor tags for keyboard 
> support in IE 5.5+ and Firefox 1.5, older browsers still require this. 
>  In in order to build complex, keyboard accessible JavaScript widgets, 
> developers are going to rely on anchor tags to call a JavaScript method.


However, they do _not_ need to use the javascript: namespace.

>  I'd like to start a thread to discuss the pros and cons of JavaScript 
> URIs and calling JavaScript functions from an anchor tag.  
>
> Assume doSomething() is a JavaScript function that may or may not take 
> any parameters.  Below are some techniques for creating links to 
> invoke a JavaScript function.  In these examples, assume loading 
> another page is not an option.
>  
> <a href="javascript:doSomething();">Action Link</a>
> <a href="javascript:;" onclick="doSomthing();">Action Link</a>
> <a href="javascript:doSomething();" onclick="doSomthing();return 
> false;">Action Link</a>
> <a href="#" onclick="doSomething();return false;">Action Link</a>
> <a href="/" onclick="doSomthing();return false;"><Action Link</a>
>
> Are there other methods? Is one recommended over others?  What are the 
> pros and cons? What about the effect on the browser history?  While a 
> javascript: URI is not defined in any official specification, I've 
> attached a simple test file using these methods that passes validation 
> as XHTML 1.0 transitional.


It only passes because it doesn't matter to the validator what's inside 
that href. It's still a fake URI, and there's no situation I can think 
of where it actually needs to exist. Having the onclick event is 
sufficient, and provides the opportunity for graceful degradation.

The method I prefer is unobtrusive JavaScript:

<a id="foo" href="serversidecode">Action Link</a>

where "serversidecode" executes the same functionality as the script. 
Then, within a <script> block (or in a linked .js file):

function do_my_bidding(obj) { ... }
document.getElementById("foo").onclick = do_my_bidding;

This allows a fully functional scriptless site to be enhanced with as 
much JavaScript as an author would like, or at the bare minimum would 
let authors send users to a failure page to tell them that their lack of 
script means they can't use the site. The rest of these possibilities 
either:
- do nothing, confusing users who will try to click the anchor again and 
again awaiting a response;
- send users to the homepage or some other URI unexpectedly (<a 
href="/">); or
- throw errors that mean nothing to users when script is off or 
unavailable (can't find site "javascript:return%20false").

-
m
Received on Wednesday, 17 August 2005 06:33:29 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 7 December 2009 10:47:39 GMT