eBay MIND Patterns
Search…
JavaScript HREF
You probably need a button, not a link.
Never use "javascript:" "#" or similar as the value of an href attribute.
The purpose of the href attribute is to specify a URL only. If you wish to run JavaScript on an element click, use a button instead.
Bad
1
<a href="javascript:;" id="share">Share on Facebook</a>
2
​
3
<script>
4
$('#share').on('click', function(e) {
5
// do fb share stuff
6
});
7
</script>
Copied!
Good
1
<!-- a button created with JavaScript -->
2
<button id="share">Share on Facebook</button>
3
​
4
<script>
5
$('#share').on('click', function(e) {
6
// do fb share stuff
7
});
8
</script>
Copied!
Even better
Use progressive enhancement:
1
<a href="http://www.facebook.com/share?id=12345" id="share">Share on Facebook</a>
2
​
3
<script>
4
$('#share').attr('role', 'button');
5
$('#share[role=button]').on('click', function(e) {
6
this.preventDefault();
7
// do fb share stuff
8
})
9
</script>
Copied!
The screen reader will announce "Share on Facebook. Button" or fallback to "Share on Facebook. Link" if JavaScript is not ready or available.
Copy link