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.
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;
}