Question

I’m currently using javscript and classes to handle my click events like so:

<a class="forgotten" href="#">Forgot your password?</a>

$('.forgotten').click(function(){
    location.href = "forgotten.php"; 
    return false;
});

Is there a way to evaluate that function first and if javascript is disabled simply go to forgotten.php?

I know I could easily remove the class and add forgotten.php to href but I’m making heavy use of jquery address so it would break some of my site.

Answer 1

Sure, start by designing your markup so that it works even if the user has javascript disabled:

<a class="forgotten" href="/forgotten.php">Forgot your password?</a>

and then you could use unobtrusive javascript:

$(function() {
    $('.forgotten').click(function(evt) {
        evt.preventDefault();
        window.location.href = "forgotten.php"; 
    });
});

obviously you probably want to do something more fancy in this javascript .click() handler other than simply redirecting to forgotten.php which is what an anchor with disabled javascript already does. You could do for example some progressive enhancement. Like an AJAX call with some animation or something.

Now if the user has javascript disabled he will simply be redirected to forgotten.php. And if he doesn’t, well, put your imagination into action.