Maison > Article > interface Web > Jquery peut-il écouter les événements ?
Jquery peut-il écouter les événements ?
- 青灯夜游original
- 2022-04-28 14:02:271990parcourir
jquery peut écouter les événements. jquery fournit une variété de méthodes de surveillance des événements : 1. click(), qui peut surveiller les événements de clic et spécifier les fonctions de traitement des événements ; 2. change(), qui peut surveiller les événements de changement et spécifier les fonctions de traitement des événements ; peut surveiller les événements de double-clic ; 4. hover(), etc.
L'environnement d'exploitation de ce tutoriel : système windows7, version jquery1.10.2, ordinateur Dell G3.
jquery peut écouter les événements.
jquery fournit une variété de méthodes pour écouter des événements, telles que click(), on() et d'autres méthodes. Voici quelques méthodes.
1. méthode click() :
la méthode click() spécifie la fonction à exécuter lorsqu'un événement de clic se produit
Exemple : texte d'alerte lorsque l'élément
est cliqué
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").click(function() {
alert("段落被点击了。");
});
});
</script>
</head>
<body>
<p>点击这个段落。</p>
</body>
</html>
2. Méthode change ()
La méthode change() spécifie la fonction à exécuter lorsque l'événement de changement se produit.
Exemple : Texte d'alerte lorsque le champ change
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function(){
$("input").change(function(){
alert("文本已被修改");
});
});
</script>
</head>
<body>
<input type="text">
<p>在输入框写一些东西，然后按下 enter 键或点击输入框外部。</p>
</body>
</html>
3. dblclick()
dblclick() spécifie la fonction à exécuter lorsqu'un événement de double-clic se produit.
Exemple : Texte d'alerte lorsque l'élément
est double-cliqué
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").dblclick(function() {
alert("这个段落被双击。");
});
});
</script>
</head>
<body>
<p>双击这个段落。</p>
</body>
</html>
4. La méthode hover()
hover() spécifie deux fonctions à exécuter lorsque le pointeur de la souris survole le fonction de l'élément sélectionné. La méthode
déclenche les événements mouseenter et mouseleave.
Exemple : Changer la couleur d'arrière-plan d'un élément
lorsque le pointeur de la souris le survole
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("p").hover(function() {
$("p").css("background-color", "yellow");
}, function() {
$("p").css("background-color", "pink");
});
});
</script>
</head>
<body>
<p>鼠标移动到该段落。</p>
</body>
</html>
Autres façons d'écouter les événements
| Méthode | Description |
|---|---|
| bind() | Ajouter un gestionnaire d'événement à l'élément |
| blur() | Ajouter/déclencher un événement de perte de focus |
| delegate() | Pour faire correspondre les éléments Ajout Les gestionnaires pour les éléments enfants actuels ou futurs de |
| die() | ont été supprimés dans la version 1.9. Supprimez tous les gestionnaires d'événements ajoutés via la méthode live() |
| error() | Obsolète dans la version 1.8. Ajouter/déclencher un événement d'erreur |
| focus() | Ajouter/déclencher un événement focus |
| focusin() | Ajouter un gestionnaire d'événements à l'événement focusin |
| focusout() | Ajouter un gestionnaire d'événements à l'événement focusout |
| keydown() | ajouter/déclencher un événement keydown |
| keypress() | ajouter/déclencher un événement keypress |
| keyup() | ajouter/déclencher un événement keyup |
| en direct( ) | a été supprimé dans la version 1.9. Ajoutez un ou plusieurs gestionnaires d'événements à l'élément sélectionné actuel ou futur |
| load() | Obsolète dans la version 1.8. Add un gestionnaire d'événements à l'événement de charge |
| mousedown () | add / déclencheur de moudown event |
| mouseEnter () | add / déclencheur de souris de souris |
| Add / Trigger Mouse quitter les événements | |
| Ajouter/déclencher un événement mousemove | |
| Ajouter/déclencher un événement mouseout | |
| Ajouter/déclencher un événement mouseover | |
| Ajouter/déclencher des événements mouseup | |
| Supprimer les gestionnaires d'événements ajoutés via la méthode on() | |
| Ajouter des gestionnaires d'événements aux éléments | |
| Ajouter un ou plusieurs gestionnaires d'événements pour l'élément sélectionné. Ce gestionnaire ne peut être déclenché qu'une seule fois par élément | |
| ajouter/déclencher un événement de redimensionnement | |
| ajouter/déclencher un événement de défilement | |
| ajouter/déclencher le select event | |
| Ajouter/déclencher l'événement de soumission | |
| Déclencher tous les événements liés à l'élément sélectionné | |
| Déclencher l'événement lié à l'élément sélectionné element Toutes les fonctions sur l'événement spécifié de l'élément sélectionné | |
| Supprimer le gestionnaire d'événements ajouté de l'élément sélectionné | |
| Supprimer de l'élément sélectionné actuel ou futur Gestionnaire d'événements | |
| est obsolète dans la version 1.8. | Ajouter un gestionnaire d'événements à l'événement de déchargement |
| Ajouter un gestionnaire d'événements à l'événement de menu contextuel |
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!