Webcam image refresh with jQuery

Code snippet to refresh images on a web page without refreshing the whole page.

Add the header with a reference to jquery.

<html>
<head>
   <script type="text/javascript" src="js/jquery.js">
   </script>

Set the refresh interval on document ready, calling our function reloadImages()

<script type="text/javascript">
$(document).ready(function() {
   setInterval('reloadImages()', 60000); // 60 seconds
});

Add our function reloadImages to reference our image ID of c131a in this case. Then change the src image to the same name plus some random attribute to prevent caching.

function reloadImages()
{
  $('#c131a').attr('src', 'c131a.jpg?' + Math.random());
}
</script>

In the body of the script, add a normal image reference making sure the id matches the one in the above reloadImages function.

<title>Cams</title>
</head>
<body>
  <img src="c131a.jpg" id="c131a" border="1" />
</body>
</html>