événement incendie uniquement lorsque le focus est déplacé en dehors de l'un des enfants d'un élément

voix
1

Je veux déclencher un événement quand et seulement quand l'utilisateur se concentre quelque part autre qu'un élément enfant du div, par exemple lorsque le focus est transféré de input1la input3:

<div onfocusout=console.log(document.activeElement)>
  <input type=text id=input1>
  <input type=text id=input2>
</div>

<input type=text id=input3>

Cependant, l'événement focusout est déclenché même lorsque les changements de mise au point dans les éléments du div, par exemple lorsque le focus est transféré de input1la input2. Pour aggraver les choses, document.activeElementrésout toujours bodyà la focusout instantanée est déclenchée (ce qui suggère que l' accent roule tout le chemin du retour à l' bodyavant de revenir à input2) donc je ne peux même vérifier manuellement où la nouvelle orientation se termine avant l'focusout est déclenchée.

Créé 02/09/2018 à 05:18
source utilisateur
Dans d'autres langues...                            


1 réponses

voix
1

Vous pouvez vérifier la relatedTargetpropriété du eventpassé au gestionnaire pour voir quel élément est d' obtenir le nouveau foyer:

const container = document.querySelector('#container');
container.addEventListener('focusout', (e) => {
  console.log(e.relatedTarget);
  if (!container.contains(e.relatedTarget)) console.log('focus is now outside of container');
});
<div id="container">
  <input type="text" id="input1">
  <input type="text" id="input2">
</div>

<input type="text" id="input3">

Créé 02/09/2018 à 05:22
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more