2011-01-03 12 views
22

chcę wykrywanie, gdy użytkownik kliknie OUT typ wejścia tekstowego, nie wjQuery. - Wykrywanie, gdy użytkownik kliknie OUT typu wprowadzanego tekstu Pole

Oto co mam ale oba zdarzenia są strzelania kliknij wewnątrz (focus):

<input id="title" val="hello" /> 

$("#title").focusout(function() { 
    console.log('inside'); 
}).blur(function() { 
    console.log('outside'); 
}); 
+3

'Rozmycie' jest wystarczająco dobre dla tego, czego potrzebujesz. Jakie jest dokładnie pytanie? –

+1

Czy jesteś pewien? Obaj strzelają do mnie, gdy * opuszczam * pole. [Przykład] (http://jsfiddle.net/j3XWM/) – user113716

+0

Proszę wyjaśnić swoje pytanie. Twój opis tego, co się dzieje, jest przeciwieństwem tego, co powinno się wydarzyć w tych wydarzeniach. Czy naprawdę mówisz, że 'focusout' i' blur' są uruchamiane po kliknięciu * wewnątrz * wejścia? – user113716

Odpowiedz

52

Można powiązać wydarzenia focus i blur tak:

<input id="title" val="hello" type="text" /> 

$("#title").focus(function() { 
    console.log('in'); 
}).blur(function() { 
    console.log('out'); 
}); 

focusout nie jest konieczne, ponieważ jest nastawiona przypadku propagacji dla elementów podrzędnych: http://api.jquery.com/focusout/

10

można napisać małą wtyczkę, jak

(function($){ 
    $.fn.outside = function(ename, cb){ 
     return this.each(function(){ 
      var $this = $(this), 
       self = this; 

      $(document).bind(ename, function tempo(e){ 
       if(e.target !== self && !$.contains(self, e.target)){ 
        cb.apply(self, [e]); 
        if(!self.parentNode) $(document.body).unbind(ename, tempo); 
       } 
      }); 
     }); 
    }; 
}(jQuery)); 

..i używać go jak:

$('#title').outside('click', function(e) { 
    console.log('outside'); 
}); 

Przykład: http://www.jsfiddle.net/tGnun/

+0

bardzo sprytny. Być może mógłbyś wyjaśnić, co robią wewnętrzne działania? –

+0

Podoba mi się, zawsze chciałem nauczyć się pisać wtyczkę – doniyor

2

To wygląda jak focusout() i blur() są zarówno wyzwalanie po kliknięciu poza tekstem. Zamiast tego spróbuj użyć focus(). Sprawdź to here.

+0

OP nie chce ostrości. Chce, aby kod wyszedł z niego po opuszczeniu wejścia. – user113716

+0

@patrick, tak, ale twierdził, że obaj strzelają, gdy wejdą na wejście. Dla mnie obaj strzelali, kiedy wychodzili (jak wspomniałeś), więc założyłem, że może był nieco pomieszany. Mój jsfiddle ma alert, który wyzwala wejście i wyjście, więc pomyślałem, że warto go opublikować. –

0

nie jestem w 100% pewien, że to jest to, czego chcesz, ale tutaj jest dźgnięcie:

<html> 
<head> 
<title>Example</title> 
<script src="jquery-1.4.3.js" type="text/javascript"></script> 
</head> 
<body id="body"> 
<script> 
    $("document").ready(function() 
    { $("#body").click(function() 
     { alert("body"); }); 
     $("#input").click(function(event) 
     { alert("input"); event.stopPropagation(); }); 
    }); 
</script> 
<h2>input below</h2> 
<input id="input" type="text"/> 
</body> 
</html>
Powiązane problemy