Les événements sont le cœur battant des applications JavaScript et la colle qui colle tout ensemble. L'événement se produit lorsque nous avons certains types d'interactions avec les pages Web du navigateur. Les événements peuvent être un utilisateur en cliquant sur certains contenus, une souris passant par un élément spécifique ou en appuyant sur certaines touches du clavier. Les événements peuvent également être quelque chose qui se produit dans un navigateur Web, comme un certain chargement de page Web, ou l'utilisateur fait défiler la fenêtre ou modifie la taille de la fenêtre.
En utilisant JavaScript, vous pouvez écouter des événements spécifiques et spécifier que certains événements se produisent en réponse à eux.
1. Ajouter une écoute d'événement
IE:
Copiez le code comme suit: joints de littyevent ("onclick", fonction () {...}) // ajouter
detachevent ("onclick", function () {...}) // supprimer
FF:
La copie de code est la suivante: addEventListener ("cliquez", fonction () {...}, false)
// Vous pouvez ajouter plusieurs événements en écoutant un objet, qui est différent de l'événement d'objet par défaut
retireEventListetenner ("click", function () {...}, false)
2. Obtenez l'objet de l'événement
IE:
La copie de code est la suivante: op.onclick = function () {
ver oevent = window.event; // comme propriété de fenêtre
}
FF:
La copie de code est la suivante: op.onclick = fonction (oevent) {
.... // Contrôle en transmettant les paramètres
}
Général:
La copie de code est la suivante: op.onclick = fonction (oevent) {
if (window.event) {
oevent = window.event;
}
}
// Il est obtenu en temps réel, mais les propriétés et les méthodes de leurs objets de retour ne sont pas cohérentes, mais elles peuvent être résolues en utilisant EventUtil!
var eventUtil = nouvel objet; / ** // * Cette méthode est utilisée pour ajouter des événements à un objet spécifique. Otarget est l'objet spécifié, SeventType est le type d'événement, tel que Click, Keydown, etc. FnHandler est la fonction de rappel de l'événement * / eventUtil.addeventHandler = fonction (otarget, septigeType, fnhandler) {// dans le cas de Firefox (otarget.AddeventListor) {Otarget.AddeventListener (Seventtypener) {Otarget.AddeventListener (Seventtypener) {Otarget.AddEventListener (Seventtypener) {Otarget.AddeventListener (Seventtypener) {Otarget. fnhandler, false); } // ie else if (otarget.attachevent) {otarget.attachevent ("on" + septintType, fnhandler); } else {otarget ["on" + septintType] = fnHandler; }}; / * Cette méthode est utilisée pour supprimer des événements spécifiques d'un objet spécifique. Otarget est l'objet spécifié, SeventType est le type d'événement, tel que Click, Keydown, etc. FnHandler est la fonction de rappel de l'événement * / eventUtil.reMoveEventHandler = function (otarget, septinttype, fnhandler) {if (otarget.remeveeventListener) {otarget.removeeventListener (SeventType, fnner, fuite.removeeventListener (SeventType, Fnnler); } else if (otarget.detachevent) {otarget.detachevent ("on" + septintType, fnHandler); } else {otarget ["On" + SeventType] = null; }}; / * Les événements au format, car IE et d'autres navigateurs obtiennent des événements différemment et que les propriétés des événements sont également différentes, cette méthode fournit un événement cohérent * / eventUtil.formatevent = function (oevent) {// Isie et Iswin se réfèrent à un fichier JS pour déterminer le paramètre et le système d'exploitation If (isie && iswin) {Oevent.Charcode = (oevent ==) "SESCRE")? Oevent.KeyCode: 0; // IE prend en charge uniquement les bulles et ne prend pas en charge la capture d'Oevent.EventPhase = 2; oevent.ischar = (oevent.charcode> 0); oevent.pagex = oevent.clientx + document.body.scrollleft; oevent.pagey = oevent.clienty + document.body.scrolltop; // Comportement par défaut des événements de blocage oevent.preventDefault = function () {this.returnvalue = false; }; // Convertit Toelement, FromElement en standard RelatedTarget if (oevent.type == "Mouseout") {oevent.relatedtarget = oevent.toElement; } else if (oevent.type == "MouseOver") {oevent.relatedTarget = oevent.fromement; } // Annuler Bubbling oevent.Stoppropagation = function () {this.cancelbubble = true; }; oevent.target = oevent.srcelement; // Ajouter un attribut de temps d'occurrence de l'événement, IE n'a pas oevent.time = (new Date) .getTime (); } return oevent; }; EventUtil.getEvent = function () {if (window.event) {// Format ie Events return this.formatevent (window.event); } else {return eventUtil.getEvent.Caller.Arguments [0]; }}; / ** a joint un fichier js qui juge le navigateur et le type de système. En introduisant certaines variables globales avec des noms évidents à la suite du jugement, vous devez faire attention aux conflits de noms variables lorsque vous utilisez: * / var susserragent = Navigator.UserAgent; var fappversion = parsefloat (Navigator.Appversion); fonction compareversions (sversion1, sversion2) {var Aversion1 = Sversion1.split ("."); var aveversion2 = sversion2.split ("."); if (aveversion1.length> aveversion2.length) {for (var i = 0; i <aveversion1.length - aveversion2.length; i ++) {aveversion2.push ("0"); }} else if (Aversion1.length <Aversion2.Length) {for (var i = 0; i <Aversion2.Length - Aversion1.length; i ++) {Aversion1.push ("0"); }} pour (var i = 0; i <aveversion1.length; i ++) {if (aveversion1 [i] <aveversion2 [i]) {return -1; } else if (aveversion1 [i]> aveversion2 [i]) {return 1; }} return 0;} var isOpera = suserager.indexof ("opera")> -1; var isminopera4 = isminopera5 = isminopera6 = isminoperaa7 = isminopera7_5 = false; if (isOpera) {var foperaverver; if (Navigator.AppName == "Opera") {fOperAVERSION = fappversion; } else {var rouperaVersion = new regexp ("opera (//d+//.//d+)"); REPERAVERSION.TEST (SUSERAGENT); fopeRaversion = parsefloat (regexp ["1 $"]); } isminopera4 = foperaversion> = 4; Isminopera5 = foperaversion> = 5; Isminopera6 = foperaversion> = 6; Isminopera7 = foperaversion> = 7; ISMINOPERA7_5 = FOPERVERVERSION> = 7,5;} var iskhtml = suserager.indexof ("khtml")> -1 || suserager.indexof ("konqueror")> -1 || susserragent.indexof ("Applewebkit")> -1; var isminsafari1 = isminsafari1_2 = false; var isMinkonq2_2 = isMinkonq3 = isMinkonq3_1 = isMinkonQ3_2 = false; if (iskhtml) {issafari = suseragernt.indexof ("Applewebkit")> -1; iskonq = suseragent.indexof ("konqueror")> -1; if (issafari) {var reapplewebkit = new regexp ("Applewebkit /// (// d + (?: //./d*)?)"); reapplewebkit.test (suserager); var fapplewebkitversion = parsefloat (regexp ["1 $"]); Isminsafari1 = fapplewebkitversion> = 85; Isminsafari1_2 = fapplewebkitversion> = 124; } else if (iskonq) {var rekonq = new regexp ("konqueror //// (// d + (?: //./d+ (?: //.//d)?)?)"); rekonq.test (suseragent); isMinkonq2_2 = compareversions (regexp ["1 $"], "2.2")> = 0; IsMinkOnQ3 = Compareversions (regexp ["1 $"], "3.0")> = 0; IsMinkonQ3_1 = Compareversions (regexp ["1 $"], "3.1")> = 0; IsMinkonQ3_2 = Compareversions (regexp ["1 $"], "3.2")> = 0; }} var isie = suseragent.indexof ("compatible")> -1 && suseragent.indexof ("msie")> -1 &&! isOpera; var isMinie4 = Isminie5 = Isminie5_5 = Isminie6 = false; if (isie) {var reie = new regexp ("msie (//d+//.//d+);"); Reie.test (SserAgent); var fieversion = parsefloat (regexp ["1 $"]); Isminie4 = fieversion> = 4; Isminie5 = fieversion> = 5; Isminie5_5 = fieversion> = 5,5; Isminie6 = fieversion> = 6.0;} var isMoz = sussergent.indexof ("gecko")> -1 &&! Iskhtml; var Isminmoz1 = smimozoz1_4 = isminmoz1_5 = false; if (Ismoz) {var remoz = new Regexp ("rv: (//d+//.//d+ (?: //.//D+)?)"); remoz.test (suseragent); isMinmoz1 = Compareversions (regexp ["1 $"], "1.0")> = 0; Isminmoz1_4 = compareversions (regexp ["1 $"], "1.4")> = 0; Isminmoz1_5 = compareversions (regexp ["1 1"], "1.5")> = 0;} var isns4 =! Isie &&! Isopera &&! Ismoz &&! Iskhtml && (suseragent.indexof ("mozilla") == 0) && (Navigator.Appname == "netsCape") & (fAPPator && fappversion <5.0); var isMinns4 = isMinns4_5 = isMinns4_7 = isMinns4_8 = false; if (isns4) {isMinns4 = true; ISMINNS4_5 = FAppversion> = 4,5; Isminns4_7 = fappversion> = 4.7; Isminns4_8 = fappversion> = 4.8;} var iswin = (Navigator.platform == "win32") || (navigator.platform == "windows"); var ismac = (navigator.platform == "mac68k") || (Navigator.platform == "macppc") || (Navigator.Platform == "Macintosh"); var isunix = (Navigator.platform == "x11") &&! Iswin &&! Ismac; var iswin95 = iswin98 = iswinnt4 = iswin2k = iswinme = iswinxp = false; var ismac68k = ismacppc = false; VarsUnos = isMinos = isMinos = Ismins = Ismacppc = FACT ISMINSUNOS5 = ISMINSUNOS5_5 = false; if (iswin) {iswin95 = suseragent.indexof ("win95")> -1 || suseragent.indexof ("Windows 95")> -1; iswin98 = suseragent.indexof ("Windows 98")> -1 || suserager.indexof ("Windows 98")> -1; iswinme = suseragent.indexof ("Windows 98")> -1 || susserragent.indexof ("Windows Me")> -1; iswin2k = suseragent.indexof ("Windows NT 5.0")> -1 || suserager.indexof ("Windows 2000")> -1; iswinxp = suseragent.indexof ("Windows NT 5.1")> -1 || suseragent.indexof ("Windows XP")> -1; iswinnt4 = suseragent.indexof ("Windows NT")> -1 || suserager.indexof ("Windows NT")> -1 || suserager.indexof ("Windows NT")> -1 || SUSERAGENT.Indexof ("Windows NT4.0")> -1 && (! IswinMe &&! Iswin2k &&! Iswinxp);} if (ismac) {ismac68k = suseragent.indexof ("mac_68000")> -1 || susserragent.indexof ("68k")> -1; ISMACPPC = SUSERAGENT.Indexof ("Mac_Powerpc")> -1 || suseragent.indexof ("ppc")> -1; } if (iSunix) {issunos = suseragent.indexof ("sunos")> -1; if (issunos) {var resUnos = new regexp ("sunos (//d+//.//d+(?://.//d+)?)"); ResUnos.Test (SserAgent); Isminsunos4 = compareversions (regexp ["1 $"], "4.0")> = 0; Isminsunos5 = compareversions (regexp ["1 $"], "5.0")> = 0; ISMINSUNOS5_5 = Compareversions (regexp ["1 $"], "5.5")> = 0; }}Ce qui précède est la gestion de l'événement JS. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.