Maison > interface Web > js tutoriel > Une introduction aux événements en JS

Une introduction aux événements en JS

小云云
Libérer: 2018-02-27 14:21:34
original
1269 Les gens l'ont consulté

1 Événement

L'événement peut être compris comme le comportement interactif entre l'utilisateur et le navigateur

2 Liaison de fonction d'événement
Fonction événementielle : Lorsqu'un événement se produit, le plan de réponse spécifique utilisé pour gérer l'événement est la fonction de traitement d'événement
Cela apparaît sous forme de blocs de code
Par exemple : Quand la souris clique (événement), quelle action effectue-t-elle ? Ceci est fait par le gestionnaire d'événements
Lorsque l'on appuie sur le clavier (appuyez sur la touche Entrée) -Que faire ?

Résumé : notez que l'occurrence d'un événement et la fonction de traitement d'événement sont des concepts différents
Après que l'événement se soit produit, il peut y avoir une fonction de traitement d'événement pour faire la chose correspondante, ou il peut n'y avoir aucun
S'il y a Il n'y a pas de fonction de traitement des événements, cela n'affectera pas l'apparition des événements, ce qui devrait arriver se produira quand même
Quant à ce qu'il faut faire, cela est décidé par la fonction de traitement des événements

3 Comment apprendre les événements<.> 1 Certains événements courants sont spécifiés en js, tels que : clic de souris, pression de souris, levage de souris, mouvement de souris
,Faites entrer et sortir la souris...
Il y a deux parties à maîtriser concernant l'événement : 1) Nom de l'événement (onclickonmouseover) 2) Scène de déclenchement correspondante
Il faut retenir le nom de l'événement et la scène déclenchante (faire plus d'exercices et copier à la main)

2 事件处理函数(功能)
  需要根据具体业务场景来实现
Copier après la connexion
4 événements Souris

Événements liés à la souris

事件名称        事件的触发场景

onmousedown     当鼠标按下的时候触发
onmouseup       当鼠标抬起的时候触发
onmouseover     当鼠标移入的时候触发
onmouseout      当鼠标移出的时候触发
onclick         当鼠标点击的时候触发
ondblclick      当鼠标双击的时候触发
onmousemove     当鼠标移动的时候触发
oncontextmenu   当鼠标右键的时候触发(可以自定义右键菜单)
Copier après la connexion
5 événements liés au clavier

Événements liés au clavier Clavier (touche) enfoncé Clavier levé
onkeydown Déclenché lorsque le clavier est enfoncé
onkeyup déclenche

6 événements de formulaire

lorsque le clavier est soulevé Événements liés au formulaire Soumission du formulaire Se concentrer Perdre la concentration

onsubmit     当表单提交的时候触发
onchange     当修改表单字段的时候触发(内容改变就会触发)
onfocus      当获取到焦点的时候触发
onblur        当失去焦点的时候触发
Copier après la connexion
7 Événements de fenêtre

Evénements liés à la fenêtre Chargement de la fenêtre Changement de fenêtre

onload      当对象加载完成以后触发
onresize    当窗口改变的时候触发
Copier après la connexion
8 Evénement objet événement

L'objet événement est un objet utilisé pour enregistrer des informations pertinentes sur l'événement lorsqu'un événement se produit
L'objet événement s'entend comme : la boîte noire de l'avion et l'enregistreur de conduite de la voiture

Point clé : rappelez-vous la solution de compatibilité var ev = ev || event

keyCode Code du clavier Entrez 13 Espace 32 Direction de contrôle
clientX, clientY Les coordonnées de la souris dans la zone visible du navigateur
offsetLeft, offsetTop

9 événements bouillonnants

Mécanisme de bouillonnement d’événements – phénomène
L'impact du bouillonnement événementiel
Empêcher les événements de bouillonner
Application du bouillonnement d'événements

创建元素、添加子元素
事件源
事件委托
Copier après la connexion
Recommandations associées :

Explication détaillée de la boucle d'événements en JS et Node.js

node .Explication détaillée du mécanisme de traitement des événements dans js

Exemple d'analyse du modèle de capture d'événement et du modèle de bouillonnement dans les compétences js_javascript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal