Maison interface Web js tutoriel 自己的js工具 Event封装_javascript技巧

自己的js工具 Event封装_javascript技巧

May 16, 2016 pm 06:47 PM
event 封装

因为ie的event是全局的而firefox的event是局部的,用起来不太方便,这个时候我们就要自己组装一下常用的event操作了,封装成类便于重用

复制代码 代码如下:

/**
类 Event
用法:
Event.getEvent();获取 ie,firefox的event
Event.getTarget();获取ie的srcElement或firefox的target
Event.isIe();是否为ie
Event.clientX(); 获取ie,fox的鼠标x坐标
Event.clientY();获取 ie,fox的鼠标y坐标
*/
var Event=new function(){
this.toString=function(){
return this.getEvent();
}
//获取 事件
this.getEvent=function(){
var ev=window.event;
if(!ev){
var c=this.getEvent.caller;
while(c){
ev=c.arguments[0];
if(ev && Event ==ev.constructor)
break;
c=c.caller;
}
}
return ev;
};
//获取 事件源
this.getTarget=function(){
var ev=this.getEvent();
return this.isIe()?ev.srcElement:ev.target;
}
//是否为ie
this.isIe=function(){
return document.all?true:false;
}
//鼠标x坐标
this.clientX=function(){
var ev=this.getEvent();
var x=this.isIe()?ev.clientX:ev.pageX;
return x;
}
//鼠标y坐标
this.clientY=function(){
var ev=this.getEvent();
var y=this.isIe()?ev.clientY:ev.pageY;
return y;
}
/**增加事件(对象,事件类型,函数指针 )
obj: html对象
sEvent: 事件名称
spNotify: 事件执行的方法
isCapture:是否允许全屏捕捉
*/
this.addEvent=function(obj,sEvent,fpNotify,isCapture){
sEvent=sEvent.indexOf("on")!=-1?sEvent:"on"+sEvent;
if(obj.addEventListener){
sEvent=sEvent.substring(sEvent.indexOf("on")+2);
obj.addEventListener(sEvent,fpNotify,isCapture);
}else{ //ie
if(isCapture)
obj.setCapture(isCapture);
obj.attachEvent(sEvent,fpNotify);
}
}
//移除事件
this.removeEvent=function(obj,sEvent,fpNotify){
if(obj.removeEventListener){
sEvent=sEvent.substring(sEvent.indexOf("on")+2)
obj.removeEventListener(sEvent,fpNotify,false);
}else{
obj.detachEvent(sEvent,fpNotify);
}
}
//获取鼠标按键,left=1,middle=2,right=3
this.button=function(){
var ev=this.getEvent();
if(!ev.which&&ev.button){//ie
return ev.button&1?1:(ev.button&2?3:(ev.button&4?2:0))
}
return ev.which;
};
//阻止事件冒泡传递
this.stopPropagation=function(){
var ev=this.getEvent();
if(this.isIe)
ev.cancelBubble=true;
else
ev.stopPropagation();
}
//阻止默认事件返回
this.preventDefault=function(){
var ev=this.getEvent();
if(this.isIe)
ev.returnValue=false;
else
ev.preventDefault();
}
}
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Où trouver la courte de la grue à atomide atomique
1 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

TrendForce : les produits de la plate-forme Blackwell de Nvidia permettent d'augmenter la capacité de production CoWoS de TSMC de 150 % cette année TrendForce : les produits de la plate-forme Blackwell de Nvidia permettent d'augmenter la capacité de production CoWoS de TSMC de 150 % cette année Apr 17, 2024 pm 08:00 PM

Selon les informations de ce site du 17 avril, TrendForce a récemment publié un rapport estimant que la demande pour les nouveaux produits de la plate-forme Blackwell de Nvidia est haussière et devrait entraîner une augmentation de la capacité totale de production d'emballages CoWoS de TSMC de plus de 150 % en 2024. Les nouveaux produits de la plate-forme Blackwell de NVIDIA comprennent des GPU de série B et des cartes accélératrices GB200 intégrant le propre processeur GraceArm de NVIDIA. TrendForce confirme que la chaîne d'approvisionnement est actuellement très optimiste quant au GB200. On estime que les livraisons en 2025 devraient dépasser le million d'unités, représentant 40 à 50 % des GPU haut de gamme de Nvidia. Nvidia prévoit de livrer des produits tels que le GB200 et le B100 au second semestre, mais le conditionnement des plaquettes en amont doit encore adopter des produits plus complexes.

Taille du boîtier AMD « Strix Halo » FP11 exposée : équivalent à Intel LGA1700, 60 % plus grand que Phoenix Taille du boîtier AMD « Strix Halo » FP11 exposée : équivalent à Intel LGA1700, 60 % plus grand que Phoenix Jul 18, 2024 am 02:04 AM

Ce site Web a rapporté le 9 juillet que les processeurs de la série « Strix » à architecture AMD Zen5 auront deux solutions de packaging. Le plus petit StrixPoint utilisera le package FP8, tandis que le StrixHalo utilisera le package FP11. Source : source videocardz @Olrak29_ La dernière révélation est que la taille du boîtier FP11 de StrixHalo est de 37,5 mm x 45 mm (1 687 millimètres carrés), ce qui est la même que la taille du boîtier LGA-1700 des processeurs Intel AlderLake et RaptorLake. Le dernier APU Phoenix d'AMD utilise une solution de packaging FP8 d'une taille de 25*40 mm, ce qui signifie que le F de StrixHalo

Bibliothèque de traitement d'événements en PHP8.0 : Événement Bibliothèque de traitement d'événements en PHP8.0 : Événement May 14, 2023 pm 05:40 PM

Bibliothèque de traitement d'événements en PHP8.0 : Événement Avec le développement continu d'Internet, PHP, en tant que langage de programmation back-end populaire, est largement utilisé dans le développement de diverses applications Web. Dans ce processus, le mécanisme événementiel est devenu un élément très important. La bibliothèque de traitement d'événements Event en PHP8.0 nous fournira une méthode de traitement d'événements plus efficace et plus flexible. Qu'est-ce que la gestion des événements ? La gestion des événements est un concept très important dans le développement d'applications Web. Les événements peuvent être n'importe quel type de ligne utilisateur

Technologie d'emballage et application en PHP Technologie d'emballage et application en PHP Oct 12, 2023 pm 01:43 PM

La technologie d'encapsulation et l'encapsulation d'applications en PHP sont un concept important dans la programmation orientée objet. Elle fait référence à l'encapsulation de données et d'opérations sur les données afin de fournir une interface d'accès unifiée aux programmes externes. En PHP, l'encapsulation peut être réalisée via des modificateurs de contrôle d'accès et des définitions de classe. Cet article présentera la technologie d'encapsulation dans PHP et ses scénarios d'application, et fournira quelques exemples de code spécifiques. 1. Modificateurs de contrôle d'accès encapsulés En PHP, l'encapsulation est principalement réalisée via des modificateurs de contrôle d'accès. PHP fournit trois modificateurs de contrôle d'accès,

Introduction à l'encapsulation Axios et aux méthodes courantes dans Vue Introduction à l'encapsulation Axios et aux méthodes courantes dans Vue Jun 09, 2023 pm 04:13 PM

Introduction à l'encapsulation Axios et aux méthodes courantes dans Vue Axios est une bibliothèque HTTP basée sur Promise. Son avantage est qu'elle offre une bonne lisibilité, une facilité d'utilisation et une évolutivité. En tant que framework frontal populaire, Vue fournit également une prise en charge complète d'Axios. Cet article expliquera comment encapsuler Axios dans Vue et présentera certaines méthodes couramment utilisées d'Axios. 1. Encapsulation d'Axios Au cours du processus de développement, nous avons souvent besoin d'effectuer une encapsulation personnalisée d'Axios, comme

Comment les fonctions C++ améliorent-elles l'efficacité du développement d'interfaces graphiques en encapsulant du code ? Comment les fonctions C++ améliorent-elles l'efficacité du développement d'interfaces graphiques en encapsulant du code ? Apr 25, 2024 pm 12:27 PM

En encapsulant le code, les fonctions C++ peuvent améliorer l'efficacité du développement de l'interface graphique : Encapsulation du code : les fonctions regroupent le code en unités indépendantes, ce qui rend le code plus facile à comprendre et à maintenir. Réutilisabilité : les fonctions créent des fonctionnalités communes qui peuvent être réutilisées dans toutes les applications, réduisant ainsi la duplication et les erreurs. Code concis : le code encapsulé rend la logique principale concise et facile à lire et à déboguer.

Comment implémenter l'encapsulation et l'héritage en langage Go Comment implémenter l'encapsulation et l'héritage en langage Go Jul 23, 2023 pm 08:17 PM

Comment implémenter l'encapsulation et l'héritage dans le langage Go L'encapsulation et l'héritage sont deux concepts importants dans la programmation orientée objet. Ils peuvent rendre le code plus modulaire et plus maintenable, et facilitent également la réutilisation du code. Cet article expliquera comment implémenter l'encapsulation et l'héritage dans le langage Go et fournira des exemples de code correspondants. Encapsulation L'encapsulation consiste à encapsuler les données et les fonctions, à masquer les détails d'implémentation et à exposer uniquement les interfaces nécessaires pour un usage externe. En langage Go, l'encapsulation se fait grâce à des identifiants exportés et non exportés. Les identifiants avec des majuscules sont accessibles par d'autres packages

Ventes d'été Steam - Valve offre 95 % de réduction sur les jeux AAA et confirme les réductions sur les jeux viraux Palworld et Content Warning Ventes d'été Steam - Valve offre 95 % de réduction sur les jeux AAA et confirme les réductions sur les jeux viraux Palworld et Content Warning Jun 26, 2024 pm 03:40 PM

Les soldes d'été de Steam ont déjà accueilli certaines des meilleures réductions sur les jeux, et cette année semble s'accumuler pour un autre home run de Valve. Une bande-annonce (à regarder ci-dessous) taquinant certains des jeux à prix réduit des soldes d'été Steam vient de sortir.

See all articles