Using Jquery Client Side JavaScript Library to load into a page Ajax style

From PlainOldWebserver

Jump to: navigation, search

The goal of the example is to show how to load a file into a web page without reloading. This example doesn't use any special POW commands. It all client side JavaScript using the <a href="http://jquery.com/">Jquery</a> Library. We will load stuff.html into jquery.html and its all possible because of POW. You can also write cookies using client side JavaScript since POW is a server (something you can't do when loading web pages from file:// urls.

You will need to download <a href="http://docs.jquery.com/Downloading_jQuery">jquery-latest.pack.js</a> from Jquery.com


stuff.html

This is the content of <b>Stuff.html</b><br>
This is the content of <b>Stuff.html</b><br>
This is the content of <b>Stuff.html</b><br>
This is the content of <b>Stuff.html</b><br>


jquery.html

<html>
<head>
<title> Using  Jquery Client Side Javascript Library to  load into  a page Ajax style</title>
<script type="text/javascript" src="jquery-latest.pack.js"></script>
<script>
$(document).ready(function(){
  $("div#click").click(function(){$("div#file").load("stuff.html");});
});
</script>
</head>
<body>
<h3> Using  <a href="http://jquery.com/">Jquery</a> Client Side Javascript Library to load into a page Ajax style</h3>

<div id="click"><u> Click to load stuff.html</u></div>
<hr>
<div id="file"> </div>
</body>
</html>
Personal tools
Navigation