Search code examples
javascriptbrowserhistory.jshtml4

use history.js to detect if HTML4 is supported so I can bypass ajax


history.js is working flawlessly on my website, in browsers that support HTML5. When a URL is clicked, it does an ajax call, and on complete, saves the state to the history. I fade in the new content with the function update_content().

on HTML4 browsers, I just want the website to treat the URL as a normal URL and skip the AJAX. I was hoping history.js has a method or function I can call to detect browser. Pseudo code below.

$(document).on('click', 'a[data-type="content"]', function(event) {

    // pseudo code
    if(History.html4() ) { return; }

    event.preventDefault();

    var href = $(this).attr('href');

    $.get(href, function(data) { 

        var new_data = $(data).siblings('#main_wrapper').html();

        // update page with the new data!
        update_content(new_data);

        // add an item to the history log
        History.pushState({ html: new_data }, event.target.textContent, event.target.href);

    });

});

I have included ONLY the html5 history.js, so it doesn't attempt to put the # in the URL.

Is there a method or function in history.js that I can use to detect if the current browser is an HTML4 browser, so I know to treat the link as normal? Is there a better way to do this?

I don't want to install a plugin like modernizr unless I have to.


Solution

  • Don't test if the browser supports HTML 4: That's a massively broad category.

    Don't test if the browser supports form submission: They all do.

    Test if the browser doesn't support the history API.

    if (!history.pushState) {
        return;
    }