1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Sommaire en PHP !</title>
<style type="text/css">
#sommaire
{
position:absolute;
background-color:cyan;
left:10px;
width:100px;
}
#page
{
position:absolute;
background-color:#AAAAAA;
left : 200px;
width:500px;
height:500px;
}
</style>
<script type='text/JavaScript'>
var xhr = null;
function getXhr()
{
if(window.XMLHttpRequest)xhr = new XMLHttpRequest();
else if(window.ActiveXObject)
{
try{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
}
function ShowPage(page)
{
getXhr();
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById('page').innerHTML=xhr.responseText;
}
}
xhr.open("GET","ajax.php?page="+page,true);
xhr.send(null);
}
</script>
</head>
<body onLoad="ShowPage(1)">
<div id="sommaire">
<h3>Sommaire</h3>
<a href="#" href="#" onClick="ShowPage(1)">Page 1</a><br/>
<a href="#" href="#" onClick="ShowPage(2)">Page 2</a><br/>
<a href="#" href="#" onClick="ShowPage(3)">Page 3</a><br/>
<a href="#" href="#" onClick="ShowPage(4)">Page 4</a><br/>
</div>
<div id="page">
</div>
</body>
</html> |
Partager