Maison > Article > interface Web > Quels sont les événements focus jquery ?

Quels sont les événements focus jquery ?

青灯夜游original: 2023-03-15 13:45:163443parcourir

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 )".

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)

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>

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)

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>

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>

[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!

Déclaration：

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

Article précédent：Qu'est-ce que le sélecteur d'attribut dans jqueryArticle suivant：Qu'est-ce que le sélecteur d'attribut dans jquery

Articles Liés

Voir plus