jQuery 事件

最新推荐文章于 2023-01-07 11:07:03 发布

CodeTerminator

最新推荐文章于 2023-01-07 11:07:03 发布

阅读量179

点赞数

分类专栏： jQuery

本文链接：https://blog.csdn.net/CodeTerminator/article/details/79467993

版权

jQuery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

jQuery 事件

1.常见的DOM事件

鼠标事件	键盘事件	表单事件	窗口事件
click	keypress	submit	load
dblclick	keydown	change	resize
mouseenter	keyup	focus	scroll
mouseleave		blur	unload

2.jQuery事件方法的语法

在 jQuery 中大多数 DOM 事件都有一个等效的 jQuery 方法。

页面中指定一个点击事件

$("p").click();

下一步定义一个事件函数来触发事件

$("p").click(function(){

//动作触发后执行的代码

});

3.常用事件方法

click()	click() 方法是当按钮点击事件被触发时会调用一个函数
dblclick()	当双击元素时，会发生 dblclick 事件
mouseenter()	当鼠标指针穿过元素时，会发生 mouseenter 事件。
mouseleave()	当鼠标指针离开元素时，会发生 mouseenter 事件。
mousedown()	当鼠标指针移动到元素上方并按下鼠标按键时，会发生mousedown事件

focus()	当元素获得焦点时，发生focus事件
blur()	当元素失去焦点时，发生blur事件
hover()	模拟光标悬停事件在元素上时触发mouseenter；离开时触发mouseleave事件。

实例：

<script>
	$(function(){
		$("#p1").click(function(){
			$(this).hide();
		});

		$("#p2").dblclick(function(){
			$(this).hide();
		});
		/*$("#p1").mouseenter(function(){
			alert('您的鼠标移到了 id="p1" 的元素上!')
		});
		$("#p1").mouseleave(function(){
			alert('您的鼠标离开了 id="p1" 的元素上!')
		});
		$("#p1").mousedown(function(){
			alert('您的鼠标按在了 id="p1" 的元素上!')
		});*/
		$("input").focus(function(){
			$(this).css("background-color","#cccccc");
		});
		$("input").blur(function(){
			$(this).css("background-color","#ffffff");
		});
	});
</script>
<body>
	<p id="p1">点击我消失</p>
	<p id="p2">双击我消失</p>

CodeTerminator

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jQuery 事件

jQuery 事件1.常见的DOM事件鼠标事件键盘事件表单事件窗口事件clickkeypresssubmitloaddblclickkeydownchangeresizemouseenterkeyupfocusscrollmouseleave blurunload2.jQuery事件方法的语法在 jQuery 中大多数 DOM 事件都有一个等效的 jQuery 方法。页面中指定一个点击事件$("...
复制链接

扫一扫