After having my last question answered, I have never see the preventDefault(); function before.
So my question is now then, What is the best method? I made the following code
<!DOCTYPE html>
<head>
<script type='text/javascript' src='files/jquery-1.7.2.min.js'></script>
<script type="text/javascript">
$(document).ready(function() {
$("#abc").click(function(ev) {
ev.preventDefault();
alert('hey');
});
});
</script>
</head>
<body>
<h1>helloasdasdasdsad</h1>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<a href="javascript:void();" id="abc">Link 1: javascript:void();</a><BR><BR>
<a href="#" id="abc">Link 2: #</a><BR><BR>
<a href="javascipt:void(0);" id="abc">Link 3: javascript:void(0);</a><BR><BR>
<a id="abc">Link 4: NO HREF</a><BR><BR>
</body>
</html>
..I hate using # because it scrolls to the top of the page. It turns out javascript:void(); in the href will cause a syntax error in IE. So is the answer to put the (ev) and ev.preventDefault(); lines in every function? Or can I just return false; at the end of every function?
What is the best, most widely accepted practice?
EDIT:
Alright, so event.preventDefault(); is the best thing to use, But that still doesnt answer what goes in the HREF if i want a redundant link? I thought best practice was to always use .click events with <a href="">, as some older browsers won’t respond to a click event or hover on DIV/SPAN/IMG elements?
See this great post which should answer your question. Also, you don’t need anything in hrefs.