[AJAX] ajax et système d'onglet
Bonjour
J'ai un problème qui à mon avis est pas trop compliqué mais je bloque. Je cherche à faire un site avec des "onglet". En faite mes onglets sont des liens. Une fois que je clique sur ces liens une page est chargé dans une div situé dans sur la même page que les onglet. J'utilise ajax pour ne pas à avoir à recharger toute la page.
Le problème est que des que je clique sur le lien la page est chargée mais disparait aussitôt. J'ai fait une page de test sur laquelle j'ai mis un lien et un bouton radio. Des que je clique sur le lien, ma page se charge mais disparait aussitôt. Alors que si je clique sur le bouton radio ma page se charge et reste.
voici le code de ma page de test
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<html>
<head>
<script language="JavaScript" type="text/javascript" src="./js/fonction.js">
<!--
//-->
</script>
<title>Untitled</title>
</head>
<body>
<a href="" onclick="javascript:load_page('profil.php')">photo et profil</a>
<input type='radio' onclick="javascript:load_page('profil.php')">essai
<div id='divPage'>
</div>
</body>
</html> |
le code de mes fonction javascript contenu dans fonction.js
Code:
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
|
function new_xhr(){
var xhr_object = null;
if(window.XMLHttpRequest) // Firefox et autres
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject){ // Internet Explorer
try {
xhr_object = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
}
}
else { // XMLHttpRequest non supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr_object = false;
}
return xhr_object;
}//fin new_xhr
function load_page(page) {
alert(page);
var xhr2 = new_xhr();//On crée un nouvel objet XMLHttpRequest
xhr2.onreadystatechange = function()
{
if ( xhr2.readyState == 4 ){//Actions executées une fois le chargement fini
if(xhr2.status != 200){//Message si il se preoduit une erreur
alert("Error code " + xhr2.status);
} else {//On met le contenu du fichier externe dans la div "content"
document.getElementById("divPage").innerHTML = xhr2.responseText;
}
} else {//Message affiché pendant le chargement
document.getElementById("divPage").innerHTML = "Chargement en cours ...<img src='./image/loading.gif' alt=''/>";
}
}
xhr2.open("GET", page, true);//Appel du fichier externe
xhr2.send(null);
}//fin load page |
et enfin le code de profil.php
Code:
1
2
3
4
|
<?php
echo "page chargée";
?> |
J'aimerai comprendre pourquoi lorsque je clique sur le lien la page disparait alors que si je clique sur le bouton radio non.
