11548 sujets

JavaScript, DOM et API Web HTML5

[resolu] 2 scripts sur ma page : quand l'un marche, l'autre non ...

Bonjour à tous, Smiley smile

Voilà, pour mon classeur en ligne, j'utilise 2 scripts : un pour faire un menu déroulant et un autre pour faire une barre de texte défilante.

Le problème, c'est que quand je mets un seul script, il marche
Exemple : Page avec le script du menu déroulant

Mais quand je veux mettre les 2, l'un marche et pas l'autre !!! Smiley decu Et suivant la position du script dans le code de la page, le deuxième marche mais le premier non Smiley biggol
Exemple : Page avec le script du menu déroulant avant celui de la barre de texte défilante
Résultat : la barre marche mais le menu reste ouvert lors de l'affichage de la page ...

Exemple : Page avec le script de la barre de texte défilante avant celui du menu déroulant
Résultat : le menu s'affiche bien (il disparait à l'affichage de la page) mais la barre de texte ne défile pas ...

N'étant pas un habitué des scripts Smiley confused , je ne vois pas du tout où est le problème ... Smiley decu

Je vous donne le code des 2 scripts tels qu'ils apparaissent sous NotePad++ :

Pour le menu déroulant :
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=20; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}


Pour la barre de texte défilante :
size=74;
x = 3*size;
place = 0;
texte = 'Etat des cartes : mint ou near-mint  - - - - - - - - -  Quantité : en 1 seul exemplaire en français ET en un seul exemplaire en anglais  - - - - - - - -';
texteDef = texte;
function defil()
        {
        texteDef = texteDef.substring(1,texteDef.length);
        while(x>texteDef.length)
                {
                texteDef += " - " + texte;
                }
        document.forms['defiletexte'].elements['defilbox'].value = texteDef;
        tempo2 = setTimeout("defil()", 130)
        }
window.onload = defil;


Et le début du code xHTML associé :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Cartes Magic recherchées - Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="style general de la page" href="magic.css" />
<link rel="shortcut icon" href="favicon.ico" />
<script type="text/javascript" src="texte-defilant-rechercher.js"></script>
<script type="text/javascript" src="menu-deroulant.js"></script>
</head>

<body>

<div id="global">
<div id="site">

<div id="header"><a name="top"></a>
</div>

<div id="barre-defilante">
	<form  id="defiletexte" action="#">
		<p>
			<input type="text" id="defilbox"  />
		</p>
	</form>
</div>

<div id="menu_gauche">
	
	<dl id="menu">
	
		<dt><a href="index-recherches.html">Accueil</a></dt>

		<dt onmouseover="javascript:montre('smenu11');" onmouseout="javascript:montre();">"Blanches"</dt>
			<dd id="smenu11" onmouseover="javascript:montre('smenu11');" onmouseout="javascript:montre();">
				<ul>
					<li><a href="unlimited.htm">Unlimited</a></li>
					<li><a href="chronicles.htm">Chronicles</a></li>
					<li><a href="blanc-trois.htm">3ème</a></li>
					<li><a href="blanc-quatre.htm">4ème</a></li>
					<li><a href="blanc-quatre-simplifiee.htm">4ème simplifiée</a></li>
					<li><a href="blanc-cinq.htm">5ème</a></li>
					<li><a href="blanc-six.htm">6ème</a></li>
					<li><a href="blanc-sept.htm">7ème</a></li>
					<li><a href="blanc-huit.htm">8ème</a></li>
					<li><a href="blanc-neuf.htm">9ème</a></li>
				</ul>
			</dd>


Merci d'avance à ceux qui prendront le temps de regarder et pour vos solutions ! Smiley biggrin

Smiley cligne
Modifié par Pandore (02 Mar 2006 - 21:45)
tu as deux fois ça :

window.onload = XXX;


Le second écrase le premier...je pense que ca doit venir de là.
clb56 a écrit :

Il y a une solution brillante et efficace proposée par Jep.


ah oui ! c'est une super solution ca !
Smiley lol
Jolie solution en effet. Mais il y a plus simple : window.attachEvent/addEventListener fonctionnent très bien aussi, sauf dans le cas où on utilise le pointeur this.
YES !!! ça marche ! : les 2 scripts fonctionnent bien em même temps maintenant Smiley biggrin Smiley biggrin Smiley biggrin

Merci à vous tous pour vos interventions et plus particulièrement à toi clb56 Smiley biggrin (merci également pour le lien Smiley cligne )

Sinon, juste pour information QuentinC, tu pourrais m'expliquer ce qu'il faut faire s.t.p. ? Car je connais pas grand chose au javascript Smiley confused , je n'ai donc pas compris ta solution ...
Pandore a écrit :
Sinon, juste pour information QuentinC, tu pourrais m'expliquer ce qu'il faut faire s.t.p. ? Car je connais pas grand chose au javascript Smiley confused , je n'ai donc pas compris ta solution ...


Je pensais à ça :

if (window.attachEvent) {
window.attachEvent('onload', fonction1);
window.attachEvent('onload', fonction2);
}
else if (window.addEventListener) {
window.addEventListener('load', fonction1);
window.addEventListener('load', fonction2);
}


En remplaçant fonction1 et fonction2 par le nom des fonctions que tu désires appeler. window.attachEvent est la version IE tandis que window.addEventListener est la version standard.
Soit dit en passant, cette solution ne marche plus si les fonctions appelées utilisent le pointeur this. Mais dans ce cas, c'est en principe pas nécessaire.
QuentinC a écrit :


Soit dit en passant, cette solution ne marche plus si les fonctions appelées utilisent le pointeur this. Mais dans ce cas, c'est en principe pas nécessaire.


Bonjour,

Si tu parles d'une fonction avec paramètres. Le problème est le même qu'avec window.onload, au lieu de fonction1 il faut écrire:


function(){fonction1(paramètres)}
clb56 > non, ce n'est pas de ça qu'il s'agit.
En fait, IE ne supporte pas l'utilisation du pointeur this pour les évènements ajoutées via attachEvent. Mais je veux parler de l'utilisation de this dans le corps de la fonction, pas en tant que paramètre.
clb56 a écrit :


Smiley lol M'engueules pas comme ça, j'ai rien dit moi Smiley lol


Qui t'as parlé t'engueulade ?
Excuse-moi si tu as mal pris ça, mais le but n'était pas de t'engueuler, loin de là. Rassure-toi.
Oups, excuses moi Quentin je voulais juste dire que ta réponse ne s'adresse sans doute pas à moi mais à un autre des auteurs du sujet.

Et c'était juste pour blaguer là dessus.
lol

Pour ta solution QuentinC, en fait il faut faire le même truc que dans le lien de clb56, créer un fichier start.js placé avant les 2 scripts que j'utilise mais il faut mettre ça :
if (window.attachEvent) {

window.attachEvent('onload', fonction1);

window.attachEvent('onload', fonction2);

}

else if (window.addEventListener) {

window.addEventListener('load', fonction1);

window.addEventListener('load', fonction2);

}

dans le fichier start.js

C'est ça ???
Modifié par Pandore (02 Mar 2006 - 21:54)
clb56 > en effet, j'ai lut trop vite. La remarque s'adresse à celui qui a posté juste au-dessus, donc chmel. Désolé.

Pandore > oui, plus ou moins (plutôt plus). En fait une subtilité supplémentaire, pour la version addEventListener, il faut ajouter un paramètre qui vaut false. Par contre ne me demande pas pourquoi, je ne sais pas à quoi sert cet argument.
Pandore a écrit :
Donc au final, avec ce paramètre false, ça donne quoi ? Smiley confused

Bonjour,
Tu peut utiliser cette fonction qui n'est pas de moi mais que j'ai simplifiée.

Un lien pour les paramètres de addEventListener.

Concernant le problème du this, QuentinC, as-tu un éxemple qui pose problème, merci
a écrit :

Concernant le problème du this, QuentinC, as-tu un éxemple qui pose problème, merci



document.getElementById('onObject').attachEvent('onXXX', function () {
alert(this.style.display);
});


Paraît-il que ça fonctionne avec firefox en utilisant addEventListener.
Sujet clos
Aller à