Jquery - appelez la fonction quand flou + clic sur certains éléments?

Question

Je veux appeler une fonction quand un certain champ devient flou, mais seulement si un certain élément est cliqué. J'ai essayé

$('form').click(function() { 
    $('.field').blur(function() { 
     //stuff 
    }); 
}); 

et

$('.field').blur(function() { 
    $('form').click(function() { 
     //stuff 
    }); 
}); 

Mais eux ne fonctionne, je pense qu'il est parce que les événements se produisent en même temps?

Answer 1

HTML

<form> 
    <input class="field" type="textarea" /> 
    <input class="field" type="textarea" /> 
</form> 
<div class="click-me-class" id="click-me">Click Me</div> 
<div class="click-me-class">Click Me Class</div> 

jQuery

$('.field').blur(function() { 
    $('#click-me').click(function(e) { 
     foo = $(this).data('events').click; 
     if(foo.length <= 1) { 
      // Place code here 
      console.log("Hello"); 
     } 
     $(this).unbind(e); 
    }); 
}); 

Vous pouvez le tester ici: http://jsfiddle.net/WfPEW/7/

Answer 2

Dans la plupart des navigateurs, vous pouvez utiliser document.activeElement pour y parvenir:

$('.field').blur(function(){ 
    if ($(document.activeElement).closest('form').length) { 
     // an element in your form now has focus 
    } 
}); 

Answer 3

J'ai édité ma réponse car nous devons prendre en compte le fait que l'événement est toujours respecté.

Ce n'est pas 100% satisfaisant, et je ne recommande pas ce genre de façon compliquée de faire les choses, mais c'est le plus approximatif.

Vous devez utiliser une variable globale pour prendre en compte le fait que le champ était flou. Dans l'événement window, il est automatiquement réinitialisé à 0, mais si le clic sur "click-me" est produit, il est vérifié avant l'événement window, car l'évènement window est barboté plus tard, il arrive immédiatement après le "click-me" cliquez sur l'événement

Working code

$(window).click(function(e) 
       { 
    $("#result").html($("#result").html()+" isBlurred=0<br/>"); 
         isBlurred=0; 
       }); 

var isBlurred=0; 

$('.field').blur(function() { 
     $("#result").html($("#result").html()+" isBlurred=1<br/>"); 
    isBlurred=1; 
}); 

    $('#click-me').click(function(e) {     
     if(isBlurred==1) 
     { 
      $("#result").html($("#result").html()+" clicked<br/>"); 
     } 

    }); 

".field" serait l'entrée et "# click-moi" serait l'élément cliqué une seule fois seulement.