201002Mär

jQuery: Klicks außerhalb eines Elements feststellen

Bei der Entwicklung von Benutzeroberflächen und Interaktionen sind in manchen Fällen die gegebenen Möglichkeiten unzureichend. Daher haben einige Entwickler schon virtuelle DOM-Events konzipiert, mit denen erweiterte Abfragen möglich sind — so lässt sich beispielsweise feststellen, wie lange der Mauszeiger über einer Fläche verweilt oder wie lange die Maustaste vom Anwender betätigt wurde. Eine weitere Funktionalität in Form eines jQuery-Plugins bietet Ben Alman mit seinem "clickoutside"-Event an: Damit können Programmierer auf Ereignisse reagieren, die auftreten, sobald der Benutzer einen Punkt außerhalb eines entsprechenden Elements angeklickt hat.

jQuery - clickoutside-Event

Dies könnte zum Beispiel bei einer Lightbox der Fall sein. Das Verwenden einer großen Overlay-Fläche würde dadurch entfallen. Testen lässt sich das jQuery-Event auf der Demoseite.
Ein Bonbon gibt es vom Plugin-Autor für interessierte JavaScript-Entwickler: Der Quelltext ist kommentiert und kann bei GitHub eingesehen werden.

RSS-Feed abonnieren

Kommentare

Heiko schrieb am 04.03.2010 #1

Sieht an sich ganz nett aus, aber jQuery kann das schon: focusout();

Matthias schrieb am 04.03.2010 #2

Nicht ganz — "focusout()" greift bei input-Feldern, sobald diese den Fokus verloren haben (ähnlich wie "blur"). Das Plugin reagiert auf die Maus-Ereignisse. Im Endeffekt handelt es sich nur um eine erweiterte "click()"-Funktion.
Die "focusout()"-Funktion ist dennoch sehr nützlich und zudem neu in jQuery 1.4 :-)

Heiko schrieb am 05.03.2010 #3

focusout funktioniert mit allen Elementen. Nicht nur bei input’s. :)

BTW: Toller Blog! Gefällt mir ausgesprochen gut – weiter so!