blur appelé 2 fois

**bigboomshakala** · 02/10/2008, 14h16

hello

j'ai reproduit dans un exemple simplissime ce sur quoi je suis tombé après qu'un client m'ait remonté une anomalie dans une page web.

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
<html>
  <head>
    <script>
      var cpt = 0;
 
      function blurHandler()
      {
        document.getElementById("span").innerHTML+= "blur n°" + cpt + ", ";
        cpt++;
      }
    </script>
  </head>
  <body>
    <input type="text" value="salut" onblur="blurHandler()"/>
    <br/>
    <span id="span"></span>
  </body>
</html>

quand je suis dans l'input et que je clique hors du navigateur, onblur est déclenché (normal). mais quelqu'un pourrait-il m'expliquer pourquoi lorsqu'on revient dans le navigateur le onblur de l'input est déclenché une seconde fois ??

NOTE :
- ce comportement intervient avec IE6, FF3
- le onblur n'est déclenché que quand on revient dans le navigateur avec Opera 9 et Chrome

Mon client est sous IE6

**E.Bzz** · 02/10/2008, 14h31

Salut

Envoyé par bigboomshakala

quand je suis dans l'input et que je clique hors du navigateur, onblur est déclenché (normal). mais quelqu'un pourrait-il m'expliquer pourquoi lorsqu'on revient dans le navigateur le onblur de l'input est déclenché une seconde fois ??

Avec le curseur dans l'input ou pas ?
Si oui : normal (le changement de fenêtre entraîne la perte du focus)

NOTE :
- ce comportement intervient avec IE6, FF3
- le onblur n'est déclenché que quand on revient dans le navigateur avec Opera 9 et Chrome

Mon client est sous IE6

Donc, ton client n'a pas le problème ?

Pas compris ta NOTE, en fait

A+

**SpaceFrog** · 02/10/2008, 14h35

il semblerait que lorsque tu quittes le navigateur il declenche le blur mais le focus reste dans le champs enfin le caret n'est pas déplacé et le veritable blur est pris en compte lors du retour de focus sur le navigateur.

**bigboomshakala** · 02/10/2008, 14h44

Envoyé par E.Bzz

Salut

Avec le curseur dans l'input ou pas ?
Si oui : normal (le changement de fenêtre entraîne la perte du focus)
Donc, ton client n'a pas le problème ?

Pas compris ta NOTE, en fait

A+

oui curseur dans l'input, puis curseur hors du navigateur
non pas normal (ou en tout cas pas intuitif)
si, le client a un problème puisqu'il est dans le cas où il y a 2 onblur au lieu d'un

dans la situation réelle avec mon client :
- lors de mon premier blur je mets des variables à null à la fin de la fonction
- lors du "2è blur" je tente d'accéder à des propriétés d'une varible null = exception

j'ai résolu en ne remettant pas à null. c'était une sécurité, mais de toute façon la variable était réaffecté au focus suivant de l'input. mais j'ai potentiellement d'autres merdes dans ce genre dans le code, voire dans d'autres projets...

je m'attendais à ce que, comme avec Opera et Chrome, il n'y ait qu'un blur.
Et encore...
avec Opera et Chrome, le blur ne se fait que quand on revient dans le navigateur, pas quand on le quitte. du coup moi je m'attend à ce que quelque chose se passe si l'utilisateur quitte le navigateur et rien ne se produit (qui nous dit que le gentil utilisateur va revenir dans le navigateur pour que le blur se passe ? il peut très bien couper sa session, avoir un écran bleu fatal, etc...

)

Envoyé par SpaceFrog

il semblerait que lorsque tu quittes le navigateur il declenche le blur mais le focus reste dans le champs enfin le caret n'est pas déplacé et le veritable blur est pris en compte lors du retour de focus sur le navigateur.

et quel est le comportement "standard" dirons-nous ? c'est space(sans frog

) dans ma tête.

**SpaceFrog** · 02/10/2008, 14h46

aucune idée sur le standard...

je pense juste à une chose ...

as tu essayé un cancelBubble sur l'input ...

ça pourrait provenir de là ..

**SpaceFrog** · 02/10/2008, 14h49

je viens de tster et non le comportement est identique avec le cancelBubble ...

selon toute logique il ne devrait pas y avoir deux declenchements ...

**E.Bzz** · 02/10/2008, 14h51

Envoyé par bigboomshakala

et quel est le comportement "standard" dirons-nous ?

Pour moi, c'est celui que tu constates dans FF et IE6

En effet, il n'y a toujours au plus qu'un objet ayant le focus à l'écran (je dis bien "à l'écran" et non "dans la fenêtre du nav"). Le focus ne peut etre, par définition, que sur un objet de la fenêtre active.
Quand la fenêtre qui a le focus passe en arrière plan, elle perd forcément le focus (as-tu déjà essayé de saisir du texte dans une fenêtre qui est en arrière plan ?) et déclenche le onblur.
Pour aller plus loin, si tu gères aussi le onfocus dans le même champ, il devrait se déclencher lorsque la fenêtre repasse en avant plan.
En résumé, quand le champ a le focus et que tu changes de fenêtre :
=> tu déclenches le onblur en la passant en arrière plan
=> tu déclenches le onfocus quand elle repasse au 1° plan

Tout ça sans explicitement quitter le champ ...

EDIT : donc dans ton oblur, faudrait pouvoir tester si la fenêtre est la fenêtre active, et sinon, annuler le traitement

A+

**SpaceFrog** · 02/10/2008, 14h54

j'avais aussi testé ça Ebzz mais ça n'a pas l'air de donner de meilleur résultat

**E.Bzz** · 02/10/2008, 15h01

Alors du coup, je sais pas si c'est compatible avec ta page, mais tu ne pourrais pas utiliser onchange plutôt que onblur ?
Ca résoudrait le problème ...

A+

**bigboomshakala** · 02/10/2008, 15h09

dans mon exemple précédent j'ai modifié la fonction et tester avec IE6

Code :

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

1
2
3
4
5
6
function blurHandler()
      {
        document.getElementById("span").innerHTML += "blur n°" + cpt + ", ";
        cpt++;
        event.cancelBubble = true;
      }

pas de changement, c'est tout pareil

EDIT : owned! bon je lag par rapport à vos réponses lol.

**Auteur** · 03/10/2008, 13h17

Je n'arrive pas à reproduire sous FF3 le phénomène décrit (ou je n'ai rien compris au problème

)

**SpaceFrog** · 03/10/2008, 13h31

En gros

l'input à le focus ...

si tu blur la fenetre ... (click sur le bureau)
un premier declencheemnt de fonction à lieu

tu reviens sur le navigateur -> un second blur est lancé

donc le innerHTML à été modifié deux fois alors qu'a priori il n'aurait pas du y avoir de blur du tout (l'input devant garder le focus lors du retour sur le nav) ou au pire un seul

**bigboomshakala** · 03/10/2008, 13h31

Envoyé par Auteur

Je n'arrive pas à reproduire sous FF3 le phénomène décrit (ou je n'ai rien compris au problème

)

c'est simple
tu cliques dans l'input, ensuite tu cliques sur le bureau, puis tu cliques sur la page (mais pas dans l'input) et là tu constates que le blur a été appelé 2 fois. une fois quand tu as cliqué hors de la fenêtre du navigateur (pas hors du document, mais vraiment hors du nav) et une deuxième fois quand tu es revenu dans le document.

par contre si

tu cliques dans l'input, ensuite tu cliques sur le bureau, puis tu cliques à nouveau dans l'input, alors le blur n'a été appelé qu'une fois (au moment où tu es sorti de la page)

**E.Bzz** · 03/10/2008, 13h43

Envoyé par bigboomshakala

tu cliques dans l'input, ensuite tu cliques sur le bureau, puis tu cliques sur la page (mais pas dans l'input) et là tu constates que le blur a été appelé 2 fois. une fois quand tu as cliqué hors de la fenêtre du navigateur (pas hors du document, mais vraiment hors du nav) et une deuxième fois quand tu es revenu dans le document.

par contre si

tu cliques dans l'input, ensuite tu cliques sur le bureau, puis tu cliques à nouveau dans l'input, alors le blur n'a été appelé qu'une fois (au moment où tu es sorti de la page)

Fonctionnement tout à fait logique (et normal selon moi).

onchange ?

A+

**SpaceFrog** · 03/10/2008, 14h04

logiques deux onblurs dont un sur le onfocus ...

**bigboomshakala** · 03/10/2008, 14h09

Envoyé par E.Bzz

Fonctionnement tout à fait logique (et normal selon moi).

onchange ?

A+

ouais avec onchange sur cet exemple ça marche "comme je voulais", je vais voir si je peux appliquer ça dans mon proj.

donc FF3/IE6 > si le doc perd le focus, l'input perd aussi le focus (1er blur) et le récupère quand on revient dans le doc (et le perd si on a cliqué en dehors : 2è blur)

Chrome/Opera > si le doc perd le focus son état est mis en standby et l'input récupère le focus quand on revient sur le doc (et le perd si on a cliqué en dehors : 1er blur)

dieu du web, merci, merci de ses subtiles et passionnantes différences entre nav qui font parfois du dév web une bidouille sans nom

**E.Bzz** · 03/10/2008, 14h23

Envoyé par SpaceFrog

logiques deux onblurs dont un sur le onfocus ...

Oui

En étant dans l'input : quand tu cliques en dehors de la fenêtre du nav, elle passe en arrière plan. L'input qu'elle contient ne peut donc avoir le focus, donc (comme dirait La Rugueuse), il l'a perdu (blur), non ?
Ensuite, si pour refaire passer la fenêtre devant, tu cliques dans la fenêtre (mais pas dans l'input), 1) la fenêtre repasse devant (donc l'input a le focus), mais simultanément, comme tu as cliqué en dehors de l'input, celui-ci perd le focus (blur bis), non ?

A+

**SpaceFrog** · 03/10/2008, 14h25

tu veux dire que si tu cliques sur la fenetre pour lui redonner le focus en cliquant sur l'input il n'y aurait pas de second onblur ?

pour moi le principe du satndby est plus logique