1.注意$(document).ready()方法和window.onload方法之间的细微区别
$(document).ready()在DOM树构建完成就会执行,而window.onload是在DOM树构建完成后且相关的文件下载完毕后才会执行。
例如:一个图库页面,且给页面上图片绑定了事件
$(document).ready()就会在图库页面的DOM结构完成就会执行,但这时候页面上面图片还没下载完毕,给图片绑定的事件也就不能起作用。这时候如果要获取图片的宽高就会失败。
 
为了解决这个问题:可以使用jQuery中的:
    $(window).load(function(){})
 
这个函数类似于JavaScript中的:
window.onload=function(){}
 
而window.onload是在所有图片下载完成后才会执行并且绑定事件。缺点是影响页面加载速度。
 
 
2.jQuery的is()与next()
 
3.事件冒泡
 
span的click冒泡到div的click,div的click冒泡到body的click。
有时候这种冒泡如果不是你想要的话,情况会比较恶劣。
因为你触发了span的点击事件也就会触发div的,触发body的。
 
jQuery中阻止冒泡的方法:
even.stopPropagation();
 
jQuery中阻止默认的行为:
even.preventDefault();
 
同时阻止冒泡与默认行为:
return false;是一种简写。
 
3.事件对象的属性
event.type()
event.stopPropagation()
even.preventDefault();
event.target();
event.relatedTarget();
event.pageX()/event.pageY()
event.which();
event.metaKey();
event.originalEvent();
 
4.模拟事件操作
 
<1>$("#but").trigger("click");
$("#but").click();
模拟了点击行为。
 
<2>trigger不仅可以触发浏览器支持的事件,还可以触发自定义事件。
$("#but").bind("zqzClick",function(){
    alert("这是zqz的自定义事件");
});
$("#but").trigger("zqzClick");或
$("#but").zqzClick(); ---------不知道这样写行不?
 
<3>trigger绑定数据
 
<4>triggerHandler()
 
<5>bind()可以绑定多个事件
 
<6>添加事件命名空间,便于管理
删除的时候只会删除命名空间下的。
 
<7>停止动画
$(this).stop(true)
//判断元素是否处于动画状态。
if(!$(element).is(":animated")){ }
 
 
 

锋利的jQuery--jQuery事件,动画(读书笔记二)的更多相关文章

  1. Implicit Animations 默认动画 读书笔记

    Implicit Animations  默认动画 读书笔记 Do what I mean, not what I say. Edna Krabappel, The Simpsons   Part I ...

  2. 《jQuery基础教程》读书笔记

    最近在看<jQuery基础教程>这本书,做了点读书笔记以备回顾,不定期更新. 第一章第二章比较基础,就此略过了... 第三章 事件 jQuery中$(document).ready()与j ...

  3. jQuery 自定义事件的学习笔记

    jquery中提供了两种方法可以绑定自定义事件: bind()和one()而绑定的自定义事件的触发,必须得用jquery中的trigger()方法才能触发. 我们先来看on事件  代码如下 复制代码 ...

  4. 《你必须知道的.NET》读书笔记二:小OO有大原则

    此篇已收录至<你必须知道的.Net>读书笔记目录贴,点击访问该目录可以获取更多内容. 一.单一职责原则 (1)核心思想:一个类最好只做一件事,只有一个引起它变化的原因 (2)常用模式:Fa ...

  5. Mastering Web Application Development with AngularJS 读书笔记(二)

    第一章笔记 (二) 一.scopes的层级和事件系统(the eventing system) 在层级中管理的scopes可以被用做事件总线.AngularJS 允许我们去传播已经命名的事件用一种有效 ...

  6. spring揭秘 读书笔记 二 BeanFactory的对象注册与依赖绑定

    本文是王福强所著<<spring揭秘>>一书的读书笔记 我们前面就说过,Spring的IoC容器时一个IoC Service Provider,而且IoC Service Pr ...

  7. how tomcat works 读书笔记(二)----------一个简单的servlet容器

    app1 (建议读者在看本章之前,先看how tomcat works 读书笔记(一)----------一个简单的web服务器 http://blog.csdn.net/dlf123321/arti ...

  8. java读书笔记二

    这是我的一些读书笔记: 我研究了一下面向对象: 面向对象符合人类看待事物的一般规律,对象的方法的实现细节是包装的,只有对象方法的实现者了解细节 我觉得面向过程是由过程.步骤.函数组成,过程是核心,面向 ...

  9. ES6读书笔记(二)

    前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...

随机推荐

  1. LeetCode: 3Sum

    Given an array S of n integers, are there elements a, b, c in S such that a + b + c = 0? Find all un ...

  2. css-父标签中的子标签默认位置

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  3. scala练习题1 基础知识

    1, 在scala REPL中输入3. 然后按下tab键,有哪些方法可以被调用? 24个方法可以被调用, 8个基本类型: 基本的操作符, 等:     2,在scala REPL中,计算3的平方根,然 ...

  4. JAVA回调机制解析

    一.回调机制概述     回调机制在JAVA代码中一直遇到,但之前不懂其原理,几乎都是绕着走.俗话说做不愿意做的事情叫做突破,故诞生了该文章,算是新年的新气象,新突破!     回调机制是什么?其实回 ...

  5. MediatorPattern(中介者模式)

    /** * 中介者模式 * @author TMAC-J * 研究了这么多设计模式,觉得无非就是几点: * 1.若两个类有耦合关系,设立一个中间类,处理两个类的关系,把两个类的耦合降低 * 2.面向接 ...

  6. javaScript生成二维码(支持中文,生成logo)

    资料搜索 选择star最多的两个 第一个就是用的比较多的jquery.qrcode.js(但不支持中文,不能带logo)啦,第二个支持ie6+,支持中文,根据第二个源代码,使得,jquery.qrco ...

  7. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  8. arcpy+PyQt+py2exe快速开发桌面端ArcGIS应用程序

    前段时间有一个项目,大体是要做一个GIS数据处理工具. 一般的方法是基于ArcObjects来进行开发,因为我对ArcObjects不太熟悉,所以就思考有没有其他简单快速的方法来做. 在查看ArcGI ...

  9. Android Bitmap 和 ByteArray的互相转换

    Android Bitmap 和 ByteArray的互相转换 移动平台图像处理,需要将图像传给native处理,如何传递?将bitmap转换成一个 byte[] 方便传递也方便cpp代码直接处理图像 ...

  10. 【微信SEO】公众号也能做排名?

    [写于2016年8月] 最近,微信团队发出一则公告,开放公众号运营者一年内更改公众号名一次,这对不少名字起的奇葩名字(包括dkplus)的公众号来说是一件好事. 为什么说是好事呢?公众号名字直接关联到 ...