Discussion :

[Maitre2B]

Bonjour à tous,

J'aimerais pouvoir compter le nombre de fois qu'un mouseover est fait sur un object.
Comment faire sachant qu'il y a plusieurs fois cette object présent et qu'il y a un addEventListener sur chacun d'entre eux ?

Créer une variable qui s’incrémente lorsqu'il y a un mouseover me semble donc impossible, car il faudrait cette variable pour chacun des objects.

Comment faire ?
Merci.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
 
function game() {
        createItem();   
        window.setTimeout(game, 1000);
    }
}
 
function createItem() {
    const newSpan = document.createElement('span');
    newSpan.setAttribute('class', 'Nail');
    newSpan.addEventListener("mouseover", countMouseOver);
    screen.appendChild(newSpan);
}
 
function countMouseOver(elem) {
     i++;
     if (i == 5)
        elem.target.style.display = 'none';
}

Ce que je veux :
Si il y a mouseOver sur un élément, incrémente i, et si i = 5, l'élément disparait.
Et ceci, pour chaque élément créé chaque seconde.

[danielhagnoul]

L'événement "mouseover" est lancé plusieurs fois tant que le pointeur bouge sur l'élément du DOM. Cet événement est depuis longtemps déconseillé au profit de "mouseenter".

Idem pour "mouseout" au profit de "mouseleave".

Voir les documentations :

mouseover : https://developer.mozilla.org/fr/doc...ents/mouseover
mouseenter : https://developer.mozilla.org/fr/doc...nts/mouseenter
mouseleave : https://developer.mozilla.org/fr/doc...nts/mouseleave

[Beginner.]

Salut,

Bien vu Daniel !

Edit : Non finalement l’événement mouseover n'est pas déclenché à chaque fois qu'on bouge le curseur souris à l'intérieur de l'objet... Du moins dans mes tests cf. ci-dessous...

Créer une variable qui s’incrémente lorsqu'il y a un mouseover me semble donc impossible, car il faudrait cette variable pour chacun des objects.

Oui une variable pour chaque objet, je ne vois pas comment faire autrement tout en étant meilleur... Mais peut-être que quelqu'un d'autre saura faire mieux...

Sinon ce n'est pas si énorme : il suffit d'ajouter cette variable à chaque objet (et de l'initialiser à 0) dans la fonction createItem()...

EDIT : J'ai testé cela ici : http://jsbin.com/zajovutiri/edit?js,output

[Maitre2B]

Merci à vous deux !

Je ne savais pas que l'on pouvait initialiser des variables propre à un object crée de cette manière

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
newSpan.indice = 0;
 	newSpan.num = numObj++;

De plus, il est effectivement plus intelligent de faire un screen.removeChild(obj); plutôt que obj.style.display = 'none';

J'ai bien appris grâce à vous deux, encore merci !