Maison > interface Web > Questions et réponses frontales > Quels sont les événements focus jquery ?

Quels sont les événements focus jquery ?

青灯夜游
Libérer: 2023-03-15 13:45:16
original
3497 Les gens l'ont consulté

Il existe deux événements focus jquery : 1. Focus obtient l'événement focus. Vous pouvez utiliser la méthode focus() pour déclencher l'événement focus, ou spécifier la fonction de traitement d'événement à exécuter lorsque l'événement focus se produit. $(sélecteur). focus(fonction)”. 2. Pour les événements de perte de focus flou, vous pouvez utiliser la méthode blur() pour déclencher l'événement de flou, ou spécifier la fonction de traitement d'événement à exécuter lorsque l'événement de flou se produit, avec la syntaxe "$(selector).blur(function )".

Quels sont les événements focus jquery ?

L'environnement d'exploitation de ce tutoriel : système windows7, version jquery3.6, ordinateur Dell G3.

Il existe deux événements de focus jquery : gagner le focus focus() et perdre le flou de focus().

jquery focus() obtient l'événement focus

Lorsqu'un élément obtient le focus, l'événement focus se produit.

Lorsqu'un élément est sélectionné par un clic de souris ou positionné par la touche de tabulation, l'élément obtient le focus. La méthode

focus() déclenche l'événement focus ou spécifie une fonction à exécuter lorsque l'événement focus se produit.

Syntaxe

//触发 focus 事件
$(selector).focus()

//将函数绑定到 focus 事件
$(selector).focus(function)
Copier après la connexion

fonction : Facultatif. Spécifie la fonction à exécuter lorsque l'événement focus se produit. ​

Exemple : méthode focus() Get focus

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.6.1.min.js"></script>
		<script>
			$(document).ready(function(){
		  $("input").focus(function(){
		    $("input").css("background-color","#FFFFCC");
		  });
		});
		</script>
	</head>
	<body>

		输入你的名字: <input type="text">

	</body>
</html>
Copier après la connexion

Quels sont les événements focus jquery ?

jquery Blur() Événement de perte de focus

L'événement de flou se produit lorsqu'un élément perd le focus. La méthode

blur() déclenche l'événement de flou ou spécifie une fonction à exécuter lorsque l'événement de flou se produit.

Conseils : Cette méthode est souvent utilisée avec la méthode focus().

Syntaxe

//为被选元素触发 blur 事件:
$(selector).blur()

//添加函数到 blur 事件:
$(selector).blur(function)
Copier après la connexion

Exemple : la méthode flou () perd le focus

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("input").focus(function() {
					$("input").css("background-color", "#FFFFCC");
				});
				$("input").blur(function() {
					$("input").css("background-color", "#D6D6FF");
				});
			});
		</script>
	</head>
	<body>
		用户名: <input type="text" />
		<p>请在上面的输入域中点击,使其获得焦点,然后在输入域外面点击,使其失去焦点。</p>
	</body>
</html>
Copier après la connexion

Quels sont les événements focus jquery ?

Utilisez l'événement de focus perdu jq blur() pour vérifier la saisie de l'utilisateur

événement de focus perdu blur() dans JQuery, nous pouvons utiliser pour vérifier si le contenu saisi par l'utilisateur dans la zone de saisie est légal. Par exemple, le code suivant donnera une invite si le contenu saisi par l'utilisateur comporte moins de cinq caractères

Exemple de code :

<input type="text" name="" id="mochu">
<script>
    $(&#39;#mochu&#39;).blur(function(){
        if($(this).val().length < 5){
            alert(&#39;字数太少了,多输入几个吧&#39;);
        }
    });
</script>
Copier après la connexion

[Recommandé. apprentissage : Tutoriel vidéo jQuery, Vidéo web front-end

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