Kalbant apie DIV elementą, yra IMG elementas ir SPAN elementas viduje, nesijaudinkite apie tai, kaip šie du vidiniai elementai yra išdėstyti, tai nėra taškas, kurį noriu aptarti.
Norėdami pasiekti kai kuriuos specialiuosius efektus, aš turiu naudoti TD onmouseover ir onmouseout įvykius, ir kai aš išbandyti jį, aš rasiu tokią situaciją:
Kai pelė juda viduje DIV, onmouseover įvykis yra suaktyvintas; Tada perkelkite pelę į IMG arba SPAN elementą viduje DIV, mes tikrai nemanome, kad pelė persikėlė į DIV išorę, bet keistas dalykas yra tai, kad onmouseout įvykis yra suaktyvintas, ir onmouseover įvykis taip pat suveikia nedelsiant.
Tai nėra tai, ko aš noriu, tai kaip aš galiu "blokuoti" Javascrip{filtering}t įvykių trukdžius, kuriuos vidiniai elementai atneša į išorinius elementus?
Čia yra du būdai:
1. nustatytiSkirtasis laikas
Kadangi po to, kai pelė juda virš vidinio elemento ir suaktyvina išorinio elemento onmouseout įvykį, išorinio elemento onmouseover taip pat bus suaktyvintas nedelsiant, todėl mums tereikia atidėti veiksmą, kurį išorinio elemento onmouseout įvykis turi atlikti trumpam laikui, ir tada vykdyti clearTimeout metodą onmouseover įvykyje, kad išvengtume vidinio elemento sukeltų įvykio trukdžių.
Žiūrėkite šį paveikslėlį apie konkretų vykdymo procesą (vertikali punktyrinė linija reiškia laiką):
Tai protingas metodas, nes suaktyvinus onmouseout, esminis metodas vykdomas ne iš karto, o laukia trumpą laiką. Jei onmouseover įvykis suaktyvinamas iš karto per šį laiką, tada iš esmės yra tikra, kad onmouseout įvykis suaktyvintas dėl vidinių elementų trukdžių, todėl naudokite clearTimeout onmouseover įvykyje, kad uždelstas metodas nebūtų vykdomas.
2. Sudėtyje yra
Padarykite tokį sprendimą, kai įjungiate pelės žymeklį, ir tada vykdykite metodo turinį, kai rezultatas yra teisingas:
Padarykite tokį sprendimą, kai onmouseout, ir tada vykdykite metodo turinį, kai rezultatas yra teisingas:
Štai aukščiau pateiktų dviejų kodo eilučių reikšmės paaiškinimas:
IE visi HTML elementai turi contain metodą, kuris nustato, ar dabartiniame elemente yra nurodytas elementas. Mes naudojame šį metodą, kad nustatytume, ar išorinio elemento įvykį sukelia vidinis elementas, o jei vidinis elementas sukelia nepageidaujamą įvykį, mes ignoruojame šį įvykį.
event.fromElement nurodo elementą, iš kurio pelė išeina, kai suaktyvinami įjungimo ir pelės išėjimo įvykiai; event.toElement nurodo elementą, į kurį pelė įeina, kai suaktyvinami pelės ir pelės išėjimo įvykiai.
Taigi pirmiau minėtų dviejų kodo eilučių reikšmė yra:
- Kai suaktyvinamas pelės perkėlimo įvykis, jis nustato, ar pelės paliktas elementas yra vidinis dabartinio elemento elementas, ir jei taip, ignoruoja šį įvykį;
- Kai suveikia onmouseout įvykis, nuspręskite, ar pelės įvestas elementas yra vidinis dabartinio elemento elementas, ir jei taip, ignoruokite šį įvykį;
Tokiu būdu vidinis elementas netrukdo išorinio elemento įjungimo ir išjungimo įvykiams.
Tačiau problema vėlgi ta, kad ne IE naršyklės nepalaiko funkcijos contain, tačiau dabar, kai žinome funkcijos contain, galime pridėti šį kodą, kad pridėtume šį kodą, kad pridėtume ne IE naršyklių palaikymą:
Aukščiau pateikti metodai nesuderinami su "Firefox":
Esmė yra jQuery:
jUžklausaNaudokite pelės lapą vietoj pelės ištraukimo, kad neatsitiktų tai, kas pasakyta aukščiau.
Be to, pelės žymeklis bus suaktyvintas pakartotinai, tiesiog naudokite pelės įvedimą.
Puikus sprendimas ~
|