Bolehkah jquery mendengar acara?-Soal Jawab bahagian hadapan-php.cn

Bolehkah jquery mendengar acara?

青灯夜游

Lepaskan： 2022-04-28 14:02:27

asal

2020 orang telah melayarinya

jquery boleh mendengar acara. jquery menyediakan pelbagai kaedah pemantauan acara: 1. click(), yang boleh memantau peristiwa klik dan menentukan fungsi pemprosesan acara 2. change(), yang boleh memantau peristiwa perubahan dan menentukan fungsi pemprosesan acara; boleh Memantau acara klik dua kali 4. hover(), dsb.

Bolehkah jquery mendengar acara?

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.2, komputer Dell G3.

jquery boleh mendengar acara.

jquery menyediakan pelbagai kaedah untuk mendengar acara, seperti klik(), on() dan kaedah lain. Berikut adalah beberapa kaedah.

1. Kaedah Klik():

Kaedah klik() menentukan fungsi untuk dijalankan apabila peristiwa klik berlaku

Contoh: Klik< ; elemen p> ialah teks amaran

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

Salin selepas log masuk

Bolehkah jquery mendengar acara?

kaedah change()

kaedah change() menentukan bila perubahan berlaku Fungsi untuk dijalankan pada acara.

Contoh: Teks makluman apabila medan berubah

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

Salin selepas log masuk

Bolehkah jquery mendengar acara?

3 dblclick()

Kaedah dblclick() menentukan fungsi yang akan dijalankan apabila peristiwa dwiklik berlaku.

Contoh: Teks makluman apabila elemen

diklik dua kali

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

Salin selepas log masuk

Bolehkah jquery mendengar acara?

kaedah tuding()

Kaedah

hover() menentukan dua fungsi untuk dijalankan apabila penunjuk tetikus melayang di atas elemen yang dipilih. Kaedah

mencetuskan peristiwa masuk tetikus dan meninggalkan tetikus.

Contoh: Tukar warna latar belakang elemen

apabila penunjuk tetikus melayang di atasnya

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

Salin selepas log masuk

Bolehkah jquery mendengar acara?

Acara mendengar Kaedah lain

方法	描述
bind()	向元素添加事件处理程序
blur()	添加/触发失去焦点事件
delegate()	向匹配元素的当前或未来的子元素添加处理程序
die()	在版本 1.9 中被移除。移除所有通过 live() 方法添加的事件处理程序
error()	在版本 1.8 中被废弃。添加/触发 error 事件
focus()	添加/触发 focus 事件
focusin()	添加事件处理程序到 focusin 事件
focusout()	添加事件处理程序到 focusout 事件
keydown()	添加/触发 keydown 事件
keypress()	添加/触发 keypress 事件
keyup()	添加/触发 keyup 事件
live()	在版本 1.9 中被移除。添加一个或多个事件处理程序到当前或未来的被选元素
load()	在版本 1.8 中被废弃。添加一个事件处理程序到 load 事件
mousedown()	添加/触发 mousedown 事件
mouseenter()	添加/触发 mouseenter 事件
mouseleave()	添加/触发 mouseleave 事件
mousemove()	添加/触发 mousemove 事件
mouseout()	添加/触发 mouseout 事件
mouseover()	添加/触发 mouseover 事件
mouseup()	添加/触发 mouseup 事件
off()	移除通过 on() 方法添加的事件处理程序
on()	向元素添加事件处理程序
one()	向被选元素添加一个或多个事件处理程序。该处理程序只能被每个元素触发一次
resize()	添加/触发 resize 事件
scroll()	添加/触发 scroll 事件
select()	添加/触发 select 事件
submit()	添加/触发 submit 事件
trigger()	触发绑定到被选元素的所有事件
triggerHandler()	触发绑定到被选元素的指定事件上的所有函数
unbind()	从被选元素上移除添加的事件处理程序
undelegate()	从现在或未来的被选元素上移除事件处理程序
unload()	在版本 1.8 中被废弃。添加事件处理程序到 unload 事件
contextmenu()	添加事件处理程序到 contextmenu 事件