Jquery入门之---------基本事件------------

最新推荐文章于 2025-09-12 14:04:02 发布

weixin_33869377

最新推荐文章于 2025-09-12 14:04:02 发布

阅读量69

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/wolfwows/p/5922607.html

本文介绍了JQuery中的事件驱动概念及简写事件的应用，包括鼠标、键盘等触发的事件，并提供了示例代码。

Javascript有一个非常重要的功能，就是事件驱动。

　　　当页面完成加载后，用户通过鼠标或键盘触发页面中绑定事件的元素即可触发。Jquery为开发者更有效率的编写事件行为，封装了大量有益的事件方法供我们应用。

事件的简写形式：

　　为了开发者更加方便的绑定事件，Jquery 封装了常用的事件以便节约更多的代码。 -------------》简写事件。

　　下面我们来主要分析一下简写事件都有哪些？

　　从触发的条件来看，可以分为：

　　　　　　　　　　1：鼠标触发的事件；

　　　　　　　　　　2：键盘触发的事件；

　　　　　　　　　　3：文档触发的事件；

　　　　　　　　　　4：表单触发的事件；

　　为了便于大家更快的记忆，我为大家准备了这张图表来助于记忆与掌握：

<div style = "width:200px;height:200px;background:green;">
	<p style = "width:100px;height:100px;background:red;">
	Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam, officiis!
	</p>
</div>
<strong>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Beatae, et quis nemo obcaecati earum consequuntur.</strong>

//mouseover事件
$("div").mouseover(function(){
	$('strong').html(function(index,value){
	return value+'1';
	});
});

//click事件
$('div').click(function(){
	$('strong').css('color','red');
});
//keypress事件
$('input').keypress(function(e){
	alert(e.charCode);
});

好了！基本的事件就讲到这了，欢迎大家继续关注！

转载于:https://www.cnblogs.com/wolfwows/p/5922607.html