jquery中的事件与应用
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery中的事件与应用相关的知识,希望对你有一定的参考价值。
当用户浏览页面时,浏览器会对页面代码进行解释或编译--这个过程实质上是通过时间来驱动的,即页面在加载时,执行一个Load事件,在这个事件中实现浏览器编译页面代码的过程。时间无论在页面元素本身还是在元素与人机交互中,都占有十分重要的地位。
事件中的冒泡现象:
时间在出发后分为两个阶段,一个是捕获(capture),另一个则是冒泡(bubbling);大多数浏览器不支持捕获阶段,jquery也不支持。因此时间出发后往往执行冒泡过程。
冒泡
<script type="text/javascript"> $(function() { var intI = 0; //记录执行次数 $("body,div,#btnShow").click(function(event) {//点击事件 intI++; //次数累加 $(".clsShow") .show()//显示 .html("您好,欢迎来到jQuery世界!")//设置内容 .append("<div>执行次数 <b>" + intI + "</b> </div>"); //追加文本 }) }) </script>
时间在执行过程中纯在冒泡现象,即虽然单机的是按钮,但按钮的外围<div>元素的时间也被出发,同时<div>元素的外围<body>元素的时间也随之被处罚,其整个事件波及的过程就像水泡一样向外冒,故称之为冒泡过程。
阻止冒泡的发生
在实际在实际的,我们并不希望时间的冒泡现象发生,即单机按钮就执行单一的单机时间,并不出发其他外围的时间。在jquery中通过stopProgragation()方法可以组织冒泡过程的发生。在上述代码中加入如下代码即可
event.stopPropagation();//阻止冒泡过程
另外还可以通过语句retrun false实现挺值时间的冒泡过程。
页面载入时间
ready()方法是jquery中的页面载入时间方法,该方法类似于传统的javascript中的onload()方法
两者区别就是方法的执行时间的不同,onload():页面中的全部元素加载完全才触发,ready():加载前就触发。
ready()的工作原理
在jquery脚本加载到页面时,会设置一个isReady的标记,用于监听页面加载的进度。遇到执行ready(),通过查看isReady是否被设置,如果未被设置,那么就说明页面并未加载完成,在次琴光下,将未完成的部分用一个数组缓存起来,当全部家在完成后,再将未完成的部分通过缓存一一执行。
以上是关于jquery中的事件与应用的主要内容,如果未能解决你的问题,请参考以下文章