What’s this about?
This is the UK website for Peter and Maureen Scargill. We live in the Northeast of England and also on occasion in Andalucia in Spain.

Read through the blog entries, menu-accessible pages and archives if you're interested! Welcome to Peter and Maureen's website.

Want to view this on your mobile? - go ahead - there's a special version just for you. Same address.

Get in touch via Facebook My Facebook Page
You should follow me on Twitter Follow me on Twitter
Join me on  Google+ Join me on Google+
Join my LinkedIn network Join my LinkedIn network
My Pinterest Pinterest

Pete's Online CV

JavaScript, JQuery and Leading Browsers– behavioural differences

It’s the second decade of the 21st century and the browser manufacturers STILL can’t agree on standards.

Here’s a simple piece of coding – almost too simple – it uses the JQUERY library (not shown) to simplify cross-browser coding.

<script language=”javascript”>
function alertMsg()
{
var gm=”/admin/ajax_keepalive.asp”;
$.get( gm, function(data) { $(“#myTimer”).html(data); } );
var t=setTimeout(alertMsg,10000);

}
alertMsg();
</script>

This simple piece of code works as follows…

The purpose of the code is to put an incrementing number into my web page… that’s all – but the number is coming from another page.. and the purpose of this is to stop session timeouts by making sure that even when the user is idle – something is happening.

The function alertMsg() sets up the address of a web page which returns nothing more than an incrementing number. Every time you call the page, it returns  an incremented number – and the jQuery then forces that number into a SPAN on my web page.  You’ll note that the following line sets a 10 second timeout to call the same routine, over and over.

Finally the routine is called – which puts up the display and sets the timer to call the routine in 10 seconds – ad-infinitum.

Except that it works a treat in Firefox – and doesn’t work at ALL in Internet Explorer.

There are TWO unrelated issues here – showing the differences between the browsers.

Firstly in Internet Explorer, the routine is never called (alertMsg()) in the first place – because the DOM is not ready when the routine runs – so the timer never gets set.  It would not matter anyway because Internet Explorer CACHES the call to ajax_keepalive() – and so it would  return the same value instead of an incrementing value – EVEN THOUGH calling this page directly in either browser WORKS a TREAT.

Here’s a version that works for both (differences show in orange)…

<script language=”javascript”>
function alertMsg()
{
var gm=”/admin/ajax_keepalive.asp?r=” + Math.random();
$.get( gm, function(data) { $(“#myTimer”).html(data); } );
var t=setTimeout(alertMsg,10000);

}
$(document).ready(function()
{
alertMsg();
});
</script>

Note that I’ve added a random number onto the end of the page call – as a parameter which never gets used – but it prevents cacheing… also I’ve wrapped the function call in a jQuery document ready function that makes sure this code (AlertMsg()) does not run until the DOM is ready.

Firefox does not need any of this stuff – Internet Explorer does – and we’re not talking old rubbish here – we’re looking at Firefox 7.01 and IE 9 !!!

Comments are closed.