ttocskcaj Posted May 4, 2012 Share Posted May 4, 2012 I'm using jQuery and HTML5 to try and create an AJAX navigation. I have the navigation in standard <a> tags like so: <a id="forums" href="{url route="forums"}">Forums</a> When JS is enabled on the browser, I don't want the browser to follow the link, but rather have AJAX take care of it (The AJAX part works fine). What I'm stuck on, is disabling the default behavior of the link. I've tried using preventDefault(), but it seems to have no effect?? Here's the code that handles the PushState/AJAX stuff. $(document).ready(function() { $('a#home').click(function(){ preventDefault() history.pushState({state:'new'},'Home','{$baseaddress}'); readurlstate(); }); $('a#forums').click(function(){ preventDefault() history.pushState({state:'new'},'Forums','{$baseaddress}forums/'); readurlstate(); }); $('a#account').click(function(){ preventDefault() history.pushState({state:'new'},'Account','{$baseaddress}account/'); readurlstate(); }); }); function readurlstate() { $("#content").html('<p>Loading...</p>'); $.ajax({ url: document.location.href }).done(function( html ) { $("#content").hide().html(html).fadeIn("fast"); }); }; Quote Link to comment Share on other sites More sharing options...
gristoi Posted May 4, 2012 Share Posted May 4, 2012 you not handling the event correctly. you will need to pass the event into the function: $('a#home').click(function(e){ e.preventDefault() Quote Link to comment Share on other sites More sharing options...
ttocskcaj Posted May 5, 2012 Author Share Posted May 5, 2012 Thanks I also just learnt that returning false in a function will stop its default action? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.