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 80 81
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test slide Jquery</title>
<link rel="stylesheet" href="style.css" media="all" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
function go()
{
// Création de l'objet XMLHttpRequest
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
http=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{// code for IE6, IE5
http=new ActiveXObject("Microsoft.XMLHTTP");
}else
{
alert("votre naviguateur ne supporte pas les objets XMLHttpRequest..");
return ;
}
var datas = null;
var nom = null;
// Récupération des éléments du formulaires
nom = document.getElementById("nom").value;
datas = "nom="+nom;
// Envoi des données
http.open("POST","traitement.php",true);
// Récupération du formulaire de comparaison et MAJ de la page
http.onreadystatechange=function()
{
if (http.readyState==4 && http.status==200)
{
document.getElementById("slide2").innerHTML=http.responseText;
}
}
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.send(datas);
}
</script>
<html>
<body>
<div id="slideshow">
<div id="slidesContainer">
<div class="slide" id="slide1">
Slide 1
<table border="1">
<tr>
<th>Nom : </th>
<td><input type="text" id="nom"/></td>
</tr>
<tr>
<th>Prenom : </th>
<td><input type="text" id="prenom"/></td>
</tr>
</table>
<button type="button" onclick="go()">Cliques-moi</button>
</div>
<div class="slide" id="slide2">
Slide 2<br/>
</div>
</div>
</div>
</body>
</html> |
Partager