.addEventListener('click', function() {alert("TEST!"); } , false);
Le
Pim
Bonsoir,
Je ne peut faire fonctionner ce code sous ce navigateur:
Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.13) Gecko/2009082121
Iceweasel/3.0.6 (Debian-3.0.6-1)
Je souhaite ajouter un évènement 'click' à une balise du type :
<div id="xx">taratata</div>, mais la balise n'est pas
dans le fichier HTML : Elle est créée en DOM.
Voiçi ce que fait le code en gros:
//Creation d'un <div id=fs>[< Agrandir >]</div>
var anewdiv = document.createElement('div');
anewdiv.id='fs';
anewdiv.innerHTML="[< Agrandir >]";
//Maintenant mise en place d'un gestionnaire d'Ev sur ce div
var evType = 'click';
if (anewdiv.addEventListener){//Mozilla ¿ firefox ¿
alert("Mozilla");
anewdiv.addEventListener(evType, function() {alert("TEST!"); } , false);
return true;
}
else if (anewdiv.attachEvent){//IE
alert("IE");
var r =
anewdiv.addEventListerner( "on" + evType, function() { alert("TEST!");});
return r;
}
else {
alert("Impossible de brancher un gestionaire d'évènements");
return false;//branchement impossible
}
#Ajout de l'élément à la page
var beforeElement = document.getElementById("topmenu");
var theParent = beforeElement.parentNode;
theParent.insertBefore(anewdiv, beforeElement);
Le code marche avec IE (je n'ai pas la version) mais pas avec ma version
de firefox.
Avec Firefox, aucune erreur n'est retournée et le gestionnaire d'Ev semble
être mis en place,mais le fait de cliquer dans le div ne semble pas opérer.
Aucune erreur dans les traces JavaScript non plus.
Je vous remercie par avance de votre Aide.
Je ne peut faire fonctionner ce code sous ce navigateur:
Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.13) Gecko/2009082121
Iceweasel/3.0.6 (Debian-3.0.6-1)
Je souhaite ajouter un évènement 'click' à une balise du type :
<div id="xx">taratata</div>, mais la balise n'est pas
dans le fichier HTML : Elle est créée en DOM.
Voiçi ce que fait le code en gros:
//Creation d'un <div id=fs>[< Agrandir >]</div>
var anewdiv = document.createElement('div');
anewdiv.id='fs';
anewdiv.innerHTML="[< Agrandir >]";
//Maintenant mise en place d'un gestionnaire d'Ev sur ce div
var evType = 'click';
if (anewdiv.addEventListener){//Mozilla ¿ firefox ¿
alert("Mozilla");
anewdiv.addEventListener(evType, function() {alert("TEST!"); } , false);
return true;
}
else if (anewdiv.attachEvent){//IE
alert("IE");
var r =
anewdiv.addEventListerner( "on" + evType, function() { alert("TEST!");});
return r;
}
else {
alert("Impossible de brancher un gestionaire d'évènements");
return false;//branchement impossible
}
#Ajout de l'élément à la page
var beforeElement = document.getElementById("topmenu");
var theParent = beforeElement.parentNode;
theParent.insertBefore(anewdiv, beforeElement);
Le code marche avec IE (je n'ai pas la version) mais pas avec ma version
de firefox.
Avec Firefox, aucune erreur n'est retournée et le gestionnaire d'Ev semble
être mis en place,mais le fait de cliquer dans le div ne semble pas opérer.
Aucune erreur dans les traces JavaScript non plus.
Je vous remercie par avance de votre Aide.
Poser une question
Bonsoir,
J'ai testé avec FF3 sous Windows XP, et le code suivant fonctionne
normalement (je n'ai gardé que la partie FF) :
<body>
<h1>addEventListener</h1>
<p id="test">blabla</p>
<script type="text/javascript">
// Creation d'un <div id=fs>[< Agrandir >]</div>
var anewdiv = document.createElement('div');
anewdiv.id='fs';
anewdiv.innerHTML="[< Agrandir >]";
// Maintenant mise en place d'un gestionnaire d'Ev sur ce div
var evType = 'click';
anewdiv.addEventListener("click",
function() {alert("TEST!")}, false);
// Ajout de l'élément à la page
var beforeElement = document.getElementById("test");
var theParent = beforeElement.parentNode;
theParent.insertBefore(anewdiv, beforeElement);
</script>
</body>
Cordialement,
Pascal
Pascal
Merci d'avoir testé pour moi.
je regarde.....
Pascal
Effectivement!
En fait le code js est bon et fonctionne!!!
C'est du à la propriété de mon div dans mon fichier css.
La zone de click doit être décallée ou masquée
et en la mettant en relative
j'arrive à cliquer dessus mais c'est pas top.
Voici les propriétes du <div id="fs">:
Je met en asolute car relative me fait
n'importe quoi sous IE.
Bon j'ai un msie.css que je peux ajuster.
#fs {
border: 1px solid red;
width: 8em;
right: 5px;
position: absolute;
top: 2.9em;
height: 1em;
background-color: #F0F0CC;
display: block;
font-size: 0.7em;
text-align:center;
}
Que pourrait-ton faire pour que cela soit plus catholique?
(doit marcher avec IE et FF).
Merçi Pascal.
Jean-Yves.
Et pourquoi un relative ne serait pas 'top' ?
Que veut dire "n'importe quoi" ?
Quel est le contexte ?
Est-ce qu'il y a seulement un doctype sur cette page ?
Et le code HTML employé est-il conforme à ce doctype ?
Sinon le brouteur (et en particulier IE) passe en quirksmode
(en traitement de soupe de balises, un peu n'importe quoi, quoi)
Sans le reste de la page on ne peut qu'affabuler (ou tout au moins
imaginer)
et Opera, et Safari, et toutes versions des sus-nommés.
(il nous sera fait grace de IE.5.5 ? Fx.0.9 ? Safari.1.2 ? Opera.6 ?)
En tous cas, mon essai fonctionne impec avec mes :
IE (5.5, 6, 7) Fx3, Safari4, Opera9.6
voir:
On peut bien mettre la classe 'fs' à position: absolute;
qui contente aussi tous navigateurs.
Mézalorsse ...
à quoi bon s'embêter à insérer le div "before" un autre truc ?
Autant l'appendChilder au body.
Nota:
il sera "plus propre" (et logique?)
de n'ajouter l'écouteur qu'à la fin :
function ajouter(lieuId) {
// fonction commune IE et autres d'ajout d'évènement
var adEcoute = function(obj, evenement, action) {
(obj.attachEvent)?
obj.attachEvent('on'+evenement, action) :
(obj.addEventListener)?
obj.addEventListener(evenement, action, false) :
alert('Ajout d'écouteur impossible');
}
// Creation d'un div: class=fs [< Agrandir >]
var anewdiv = document.createElement('div');
anewdiv.className = 'fs';
anewdiv.innerHTML = "[< Agrandir >]";
// Ajout de l'élément à la page
var beforeElement = document.getElementById(lieuId);
var theParent = beforeElement.parentNode;
theParent.insertBefore(anewdiv, beforeElement);
// Maintenant mise en place d'un gestionnaire d'Ev sur ce div
adEcoute(anewdiv, 'click', function(){alert('Test');});
}
--
sm
D'ailleurs peut-on vraiment appeler ça un "écouteur"
quand un simple 'onQqueChose' suffit :
var adEcoute = function(obj, evenement, action) {
obj['on'+evenement] = action;
}
fera bien le même boulot que le longuet :
function ajouter(lieuId) {
var anewdiv = document.createElement('div');
anewdiv.className = 'fs';
anewdiv.innerHTML = "[< Agrandir >]";
// fonction commune IE et autres d'ajout d'événnement
var adEcoute = function(obj, evenement, action) {
obj['on'+evenement] = action;
}
// Ajout de l'élément à la page
var beforeElement = document.getElementById(lieuId);
beforeElement.parentNode.insertBefore(anewdiv, beforeElement);
// Maintenant mise en place d'un gestionnaire d'Ev sur ce div
adEcoute(anewdiv, 'click', function(){alert('Test');});
/********
* ou :
* anewdiv.onclick = function(){alert('Test');});
*
**************************************************/
}
--
sm