11548 sujets

JavaScript, DOM et API Web HTML5

[resolu] - [javascript] Probleme events onClick et onMouseOut sous IE7

Bonjour,

Afin de corriger un probleme de positionnement dans mon site web, j'ai cree le script suivant:


window.onload = createRef

function createRef(){
    ...
    
    var a = document.createElement("a");
    a.href = "#" + entry.element.id;
    
    a.setAttribute("onClick", "clicked=1;");
    a.setAttribute("onMouseOut", "scroll(-140);");
    
    ...
} //end createRef

function scroll(step) {
  // alert("enter scroll function");
  
  if (clicked == 1) {
    window.scrollBy(0, step);
    clicked = 0;
  } //end if
} //end scroll


Celui-ci joue parfaitement son role avec Firefox par contre la methode scroll() n'est jamais appelee avec Internet Explorer, et comme je ne suis pas du tout un specialiste Javascript je m'en remets a vous! Smiley cligne

Pour info, mon objectif est de faire un scroll negatif si l'utilisateur clic sur un lien qui renvoie sur une ancre. Ceci afin d'afficher le texte correctement en cas d'utilisation d'une baniere fixe au sommet de ma page.

Merci par avance pour votre aide precieuse

Nono's
Salut,

Je ne crois pas que IE supporte l'ajout de gestionnaires d'événements via setAttribute. Il vaut mieux utiliser directement les propriétés de l'objet JavaScript :
a.onclick = function() {
  clicked = 1;
};

Modifié par Julien Royer (27 Mar 2007 - 12:49)
Hello,

Selon ta proposition, j'ai modifie mon source comme ci-dessous malheureusement sans succes.

Je m'explique... mon script cree une table des matieres dynamique en fonction du contenu de la page. Si je modifie le code tel que propose, un event 'onClick' est genere pour chaque ligne de ma table des matieres (j'aimerai bien savoir pourquoi d'ailleurs...). Une fois la table generee, le fait de cliquer sur un element de celle-ci ne declanche plus d'event (la aussi... j'aimerai bien comprendre pourquoi! Smiley cligne ).

Bref... en resume... j'suis pas sorti de l'auberge!


window.onload = createRef

function createRef(){
    ...

    var a = document.createElement("a");
    a.href = "#" + entry.element.id;
    
    a.onClick = isClicked(1);
    a.onMouseOut = scroll(-140);

    ...
} //end createRef

function isClicked(state) {
  clicked = state;
} //end isClicked

function scroll(step) {
  
  //alert("enter scroll function: " + clicked);
  if (clicked == 1) {
    window.scrollBy(0, step);
    isClicked(0);
  } //end if
} //end scroll
Il faut que tu assignes la fonction à exécuter à la propriété onclick. Dans ton cas, tu appelles la fonction et tu assignes son résultat. il faut faire quelque chose dans le genre :
function isClicked() {
  clicked = 1;
}

a.onclick = isClicked;

// Ou

function isClicked(state) {
  clicked = state;
}

a.onclick = function() {
  isClicked(1);
};
Hello Julien,

Apres avoir tourne et retourne mon code dans tous les sens, enfin la solution j'ai trouve! Smiley cligne

En effet, il faut bien declarer les fonctions tel que tu m'as indique dans ta reponse precedente. Il faut cependant que les methodes 'onclick' et 'onmouseout' soient ecrite en minuscule (ce qui n'etait pas mon cas).

Voici donc la version finale:

function generateToc() {
  var scrollStep = -140;
  isClicked(0);
  ...
  
  a.onclick = function() { isClicked(1); };
  a.onmouseout = function() { scroll(scrollStep); };

  ...
}

function isClicked(state) {
  clicked = state;
} //end isClicked

function scroll(step) {
  if (clicked == 1) {
    window.scrollBy(0, step);
    isClicked(0);
  } //end if
} //end scroll


Encore merci

Nono's
Alors moi je rencontre le même problème, mais je peux bien prendre le problème dans tous les sens, c'est toujours nada, il ne se passe strictement rien. Et pourtant j'écrit bien le nom de la propriété en minuscule.


var ctrl;
ctrl = document.getElementById('MyID');
ctrl.onclick = myOnClickProc;


Rien!

La seule chose qui fonctionne, c'est

window.onload = init;

Ca, ça marche, ok

Mais ce qui est plus haut ne fonctionne pas, c'est comme si rien n'était fait. Note : ce code (le premier) se trouve dans la fonction init. Est-ce que ça peut jouer ?

Merci pour tout... je fatigue sur cette histoire
Modérateur
Bonjour hibou57,

Etant donné que je ne vois pas trop ce que tu as fait pour que ça ne marche pas, je te laisse un petit exemple qui ressemble à ce que tu tentes de faire... et qui fonctionne :
<!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>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />

		<title>Exemple</title>

		<script type="text/javascript"><!--

function init(sId)
{
	var oA;
	oA = document.getElementById(sId);
	oA.onclick = test;
}

function test()
{
	alert(this.id);
	return false;
}

window.onload = function() {
                   init('coucou');
                };

		//--></script>
	</head>
	<body>

<a href="#" id="coucou">coucou</a>

	</body>
</html>

Modifié par koala64 (18 Jun 2007 - 10:58)
Sujet clos
Aller à