Javascript egéreseményeket

Események MouseDown, MouseUp és kattintson

Amikor a felhasználó rákattint egy elemre, akkor nem fordulhat elő, kevesebb, mint 3 egéreseményeket a következő sorrendben:

  1. mousedown. a felhasználó megnyomja az egér gombját elem
  2. MouseUp. A felhasználó kiadta az egér gombját elem
  3. kattintson. talált mousedown eseményeket az elem és MouseUp

Alapvetően MouseDown események és MouseUp hasznosabb, mint egy kattintással. Előfordul, hogy a felhasználó rákattint az egér, de a kattintás esemény nem működik.

Különben is, ez a probléma csak ha azt akarjuk, regisztrálnia kell rakodók onmousedown / fel eseményeket. de a legtöbb esetben hiányzik az események kattintva.

Ne feledje, hogy ha használja alert'y, a böngésző is összezavarodnak, és elveszíti a futó események sorrendjét és a hívások számát.

dblclick esemény (dupla kattintással)

Esemény dblclick sokkal kevésbé használják az összes többi egér eseményeket. Mindegy, ha használja, győződjön meg róla, hogy ne használja a onclick eseménykezelő és ondblclick ugyanazon HTML elem. Határozza meg, hogy a felhasználó tette szinte lehetetlenné ebben az esetben.

Amikor a felhasználó duplán rákattint egy elemre a kattintás kiváltó esemény az első, majd dblclick. A figyelmeztető üzenetek is rendkívül veszélyes.

MouseMove esemény

MouseMove esemény jól működik, de meg kell emlékezni, hogy a kezelést az ilyen események eltarthat egy ideig. MouseMove kiváltó esemény, amikor a felhasználó mozgatja az egérkurzort egy pixel. Ez nem tűnik valami különleges folyik, de belül van egy komplex függvény, eljárás, amelynek végrehajtását tart hosszú ideig. Ez ahhoz vezethet, hogy instabil az oldal működését. Ezért a legjobb, ha a felvezető onMouseMove eseményeket. csak akkor, ha valóban szükséges, és biztos, hogy távolítsa el a jövőben.

Egéráthúzási és mouseout események

Nézzünk egy gyors példát. Próbálja ki tudta mozgatni az egeret a terméket más háttérrel. 1 elem kell villogni kicsit, ha lebeg a kurzor - ez váltotta ki egéráthúzási esemény.

Azonban, amint látható, ez a kiváltó esemény, és ha lebeg az egeret kurcora element№2 és még span.

Ennek az az oka viselkedés, hogy az esemény van beállítva, hogy az első elem is alkalmazni kell minden gyermek csomópontok. Minden világos, de a probléma merül fel, amikor már valamilyen tevékenységet, amikor elhaladnak a kurzort, például a span elem elementu№2.

„Hol volt az egér?” vagy tulajdonságokat relatedTarget, fromElement és toElement

A srácok a W3C hozzáadott relatedTarget -nak mouseover és mouseout eseményeket. Az ingatlan tartalmaz egy elemet, amely jött a kurzort az esetben, ha az egérmutatót az elem, amelyre az egeret mozgatjuk az esemény elmozdítja azt.

Microsoft létrehozott két stvoystva az adatokat tárolja:

  • fromElement - kifejezés olyan elemet, amely jött az egeret.
  • toElement - az elemet, amelyre eljött az egeret.

cross-browser-kód

És így, ha azt szeretné tudni, hogy honnan jöttem egér segítségével egéráthúzási esemény. Használja ki a következő script:

Abban az esetben, a program külön esemény mouseout (tételt, amelyre a kurzor):

Mouseenter és mouseleave

A Microsoft kínál egy másik módja annak, hogy megoldja a problémát. Az általuk létrehozott 2 új események és mouseenter mouseleave. Ezek az események ugyanúgy viselkedett, mint a mouseover és elmozdítja azt. Az egyetlen különbség -, hogy az események nem „ugrik” a gyermek elemek. Nagyon jó megoldása a problémát, feltéve a példát.

Kapcsolódó cikkek