new!
|
|
|
 |
| > Afficher / charger / masquer div |
[ Posté par jeremy7327 ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 01-07-2008 à 23:18 | 12 messages ]
|
Bonjours,
Je cherche a avoirs un script qui affiche et masque un div mai que le contenu du div est sur une autre page.
Voici mon script qui affiche et masque un div:
<html>
<head>
</style>
<script type="text/javascript">
var ie = (document.all) ? true : false;
function getElementByClass(objClass){
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements.className==objClass){
return elements[i]
}
}
}
function toggleClass(objClass){
if (getElementByClass(objClass).style.display=="none"){
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="block"
}
}
}else{
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="none"
}
}
}
}
</script>
</head>
<body>
<a href="javascript:toggleClass('test1')">button 1</a>
<div class="test1" style="display:none">
TEST 1
</div>
<a href="javascript:toggleClass('test2')">button 2</a>
<div class="test2" style="display:none">
TEST 2
</div>
</body>
</html>
|
|
J'aimerai bien qu'il soi modifier a fartir de ques qu'il y a la:
<script type="text/javascript">
function exemple()
{
obj = document.getElementById("resultat");
// ON EFFACE LE CONTENU DU DUV
obj.innerHTML = "";
if(window.XMLHttpRequest) // FIREFOX
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // IE
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else
return(false);
// CONTROLE DE L'ETAT DE LA REQUETE
// CHAQUE CHANGEMENT D'ETAT AFFICHE UNE LIGNE DANS NOTRE DIV
xhr_object.onreadystatechange = function()
{
if(xhr_object.readyState == 1)
obj.innerHTML += "connexion établie<br />";
if(xhr_object.readyState == 2)
obj.innerHTML+= "requête reçue<br />";
if(xhr_object.readyState == 3)
obj.innerHTML += "réponse en cours<br />";
if(xhr_object.readyState == 4)
{
// ON CONTROLE LE STATUS (ERREUR 404, ETC)
if(xhr_object.status == 200)
obj.innerHTML += "Fichier : " + xhr_object.responseText;
else
obj.innerHTML +="Error code " + xhr_object.status;
}
};
// ON APPELLE LA PAGE
xhr_object.open("GET", "/misc/ajax_test.php", true);
xhr_object.send(null);
}
</script>
<a href="javascript:exemple()">Hop, on essaye !</a>
<div id="resultat"></div>
|
|
Ce que je veux:
Il y a plusieurs lien et plusieurs div.
Lorsqu'on clique sur un lien, le div correspondent au lien s'affiche et une image de chargement apparais dans le div.
Le contenu du div ce charge.
Chaque contenu a une URL différente.
Le contenu remplace l'image de chargement lorsqu'il est charger.
si on reclique sur le lien, le contenu du div s'efface et le div ce masque.
En gros, je veux le même résulta le premier script mai que le contenu du div test1 et test2 soi sur des page différente.
Merci de m'aider.
[i][Message édité par jeremy7327 le 02-07-2008 à 01:09]
|
|
|
|
[ Posté par jeremy7327 ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 02-07-2008 à 17:05 | 12 messages ]
|
reglé
<html>
<head>
</style>
<script type="text/javascript">
var ie = (document.all) ? true : false;
function getElementByClass(objClass){
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
return elements[i]
}
}
}
function toggleClass(objClass, url){
if (getElementByClass(objClass).style.display=="none"){
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="block"
obj = elements[i];
obj.innerHTML = "";
if(window.XMLHttpRequest)
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject)
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else
return(false);
xhr_object.onreadystatechange = function()
{
if(xhr_object.readyState == 1)
obj.innerHTML = "connexion établie<br />";
if(xhr_object.readyState == 4)
{
if(xhr_object.status == 200)
obj.innerHTML = xhr_object.responseText;
else
obj.innerHTML +="Error code " + xhr_object.status;
}
};
xhr_object.open("GET", url, true);
xhr_object.send(null);
}
}
}else{
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="none"
elements[i].innerHTML = "";
}
}
}
}
</script>
</head>
<body>
<a href="javascript:toggleClass('test1', 'test.html')">button 1</a>
<div class="test1" style="display:none"> </div>
<a href="javascript:toggleClass('test2')">button 2</a>
<div class="test2" style="display:none"> </div>
</body>
</html> |
|
|
|
Services email :
Vous devez vous identifier pour profiter des services par email du forum.
|
|
]
