Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Apakah acara fokus jquery?

Apakah acara fokus jquery?

青灯夜游
Lepaskan: 2023-03-15 13:45:16
asal
3480 orang telah melayarinya

Terdapat dua peristiwa fokus jquery: 1. Fokus mendapat acara fokus Anda boleh menggunakan kaedah fokus() untuk mencetuskan acara fokus, atau menentukan fungsi pemprosesan acara untuk dijalankan apabila acara fokus berlaku sintaks "$( pemilih).fokus(fungsi)". 2. Untuk kehilangan kabur peristiwa fokus, anda boleh menggunakan kaedah blur() untuk mencetuskan peristiwa kabur, atau menentukan fungsi pemprosesan acara untuk dijalankan apabila peristiwa kabur berlaku, dengan sintaks "$(selector).blur(function )".

Apakah acara fokus jquery?

Persekitaran pengendalian tutorial ini: sistem windows7, versi jquery3.6, komputer Dell G3.

Terdapat dua peristiwa fokus jquery: memperoleh fokus fokus() dan kehilangan fokus blur().

jquery focus() mendapat acara fokus

Acara fokus berlaku apabila elemen mendapat fokus.

Apabila elemen dipilih dengan klik tetikus atau diletakkan dengan kekunci tab, elemen itu mendapat fokus. Kaedah

fokus() mencetuskan acara fokus, atau menentukan fungsi untuk dijalankan apabila acara fokus berlaku.

Sintaks

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

//将函数绑定到 focus 事件
$(selector).focus(function)
Salin selepas log masuk

fungsi: Pilihan. Menentukan fungsi untuk dijalankan apabila peristiwa fokus berlaku.

Contoh: kaedah focus() mendapat fokus

<!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>
Salin selepas log masuk

Apakah acara fokus jquery?

jquery blur() hilang fokus Peristiwa

Peristiwa kabur berlaku apabila elemen kehilangan fokus. Kaedah

blur() mencetuskan peristiwa kabur atau menentukan fungsi untuk dijalankan apabila peristiwa kabur berlaku.

Petua: Kaedah ini sering digunakan bersama dengan kaedah fokus().

Sintaks

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

//添加函数到 blur 事件:
$(selector).blur(function)
Salin selepas log masuk

Contoh: kaedah blur() hilang fokus

<!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>
Salin selepas log masuk

Apakah acara fokus jquery?

Gunakan acara fokus jq blur() untuk mengesahkan kandungan yang dimasukkan oleh pengguna

Acara fokus blur() dalam JQuery boleh digunakan untuk menyemak sama ada kandungan yang dimasukkan oleh pengguna dalam kotak input adalah sah , seperti kod berikut, jika pengguna memasukkan kurang daripada lima aksara, gesaan akan diberikan

Kod contoh:

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

[Pembelajaran yang disyorkan: jQuery tutorial video , video bahagian hadapan web]

Atas ialah kandungan terperinci Apakah acara fokus jquery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan