jquery中的事件及动画

一.事件

页面加载

$(document).ready(function(){xxxxx})

简写

$(function(){
//do something
})

元素绑定事件

bind()   on()

bing(事件类型,可选参数:事件对象的额外的数据对象,绑定处理函数);

hover()  toggle()//1.91版本后去除 解决办法 详见我另一篇文章

自定义事件

事件冒泡

<script type="text/javascript">
$(function(){
// 为span元素绑定click事件
$('span').bind("click",function(){
var txt = $('#msg').html() + "<p>内层span元素被点击.<p/>";
$('#msg').html(txt);
});
// 为div元素绑定click事件
$('#content').bind("click",function(){
var txt = $('#msg').html() + "<p>外层div元素被点击.<p/>";
$('#msg').html(txt);
});
// 为body元素绑定click事件
$("body").bind("click",function(){
var txt = $('#msg').html() + "<p>body元素被点击.<p/>";
$('#msg').html(txt);
});
})
</script>
</head>
<body>
<div id="content">
外层div元素
<span>内层span元素</span>
外层div元素
</div> <div id="msg"></div>

阻止默认事件

event.stopPropagation();  或者 rturn  false
<script type="text/javascript">
$('#content').bind("click",function(event){
var txt = $('#msg').html() + "<p>外层div元素被点击.<p/>";
$('#msg').html(txt);
event.stopPropagation();
});

移除事件

unbind

模拟事件

trigger()与 one()

二.动画

跳过show  hide

animate()方法

【锋利的Jquery】读书笔记四的更多相关文章

  1. 锋利的jQuery读书笔记---选择器

    前段时间入手了锋利的jQuery(第二版),想着加强下自己的js能力,可前段时间一只在熟悉Spring和Hibernate.最近抽时间开始读这本书了,随便也做了些记录. 读书的过程是边看边代码测试,所 ...

  2. 锋利的jQuery读书笔记---jQuery中Ajax--序列化元素、Ajax全局事件

    serialize()方法: 作用于一个jQuery对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. <!DOCTYPE html> <html> <hea ...

  3. 锋利的jQuery读书笔记---jQuery中Ajax--get、post等方法

    load()方法通常用来从Web服务器上获取静态的数据文件,然而这并不能体现ajax的全部价值. 在项目中,如果需要传递一些参数给服务器中的页面,那么可以使用$.get()或者$.post()方法(或 ...

  4. 锋利的jQuery读书笔记---jQuery中Ajax--load方法

    第一个Ajax例子 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  5. 锋利的jQuery读书笔记---jQuery中动画

    jQuery中的动画: 1.show和hide 2.fadeIn和fadeOut 3.slideUp和slideDown <!DOCTYPE html> <html> < ...

  6. 锋利的jQuery读书笔记---jQuery中的事件

    jQuery中的事件: 1.加载DOM:注意window.onload和$(document).ready()的不同 2.事件绑定 3.合成事件 --2和3的详细信息见代码- <!DOCTYPE ...

  7. 锋利的jQuery读书笔记---jQuery中操作DOM

    一般来说,DOM的操作分为3个方面,即DOM Core.HTML-DOM和CSS-DOM jQuery中的DOM操作主要包括以下种类: 查找节点 查找元素节点 查找属性节点 创建节点 创建元素节点 创 ...

  8. 锋利的jQuery--Ajax(读书笔记四)

    1.表单值得序列化 <1>serialize() 例子: html: <form action=""> First name: <input type ...

  9. <锋利的jQuery>读书笔记

  10. 【转】Verilog HDL常用建模方式——《Verilog与数字ASIC设计基础》读书笔记(四)

    Verilog HDL常用建模方式——<Verilog与数字ASIC设计基础>读书笔记(四) Verilog HDL的基本功能之一是描述可综合的硬件逻辑电路.所谓综合(Synthesis) ...

随机推荐

  1. 【转】android动画之Tween动画 (渐变、缩放、位移、旋转)

    原文:http://blog.csdn.net/feng88724/article/details/6318430 Android 平台提供了两类动画. 一类是Tween动画,就是对场景里的对象不断的 ...

  2. win7 Python 环境 准备 配置

    包括Python,eclipse,jdk,pydev,pip,setuptools,beautifulsoup,pyyaml,nltk,mysqldb的下载安装配置. **************** ...

  3. 利用Matlab生成一个网格化的三维三轴椭球面(生成直角坐标)

    代码很简单,a,b,c分别为椭球的三轴轴长,a=b=c时得到的是三维球面,a=b!=c时得到的是三维椭球面,a!=b且a!=c且b!=c时得到的是三维旋转椭球面 %生成一个笛卡尔坐标系下三轴椭球表面的 ...

  4. 让VS2010记住TFS的登陆用户名和密码

    用VS进行团队开发的都知道,每次打开VS连接TFS的时候,都要提示输入用户名和密码,每次都这样无疑感觉太多此一举了(当然你不想别人操作你的电脑就直接进入项目就没必要这么做),为了像连接远程那样可以记住 ...

  5. Weapsy 分析网站架构

    Weapsy 分析(一)网站架构 这个项目看了好久了,但是老没时间写一些分析心得.下班后想了想,事情也不能老拖着,还是得做. 如图所示:Weapsy由5个项目所组成,有点可惜了,没有测试的项目,说明一 ...

  6. 朴素贝页斯分类法 c++实现

    朴素贝叶斯法是基于贝叶斯定理与特征条件独立假设的分类方法.对于搞机器学习的同学们来说,这是相对简单但效果较好的模型. 朴素贝叶斯方法的理论 设输入为n维特征向量X={x1,x2,...,xn},输出为 ...

  7. XP系统安装ArcGIS10.0需要修改的一个配置

    1,右击我的电脑,查看属性. 2,选择“高级”选项卡,“启动和故障恢复”单击“设置”.   3,在“默认操作系统”中单击“编辑”:   4,在弹出的boot.ini文档中把操作系统改成相应的操作系统, ...

  8. JS判断字符串是否包含某字符串 indexOf()方法使用

    定义和用法 indexOf()方法可返回某个指定的字符串值在字符串中首次出现的位置. 开始的.如果没有找到子字符串,则返回 -1. 示例: <script type="text/jav ...

  9. Form.Close跟Form.Dispose

    关于Form.Close跟Form.Dispose   我们在Winform开发的时候,使用From.Show来显示窗口,使用Form.Close来关闭窗口.熟悉Winform开发的想必对这些非常熟悉 ...

  10. C#:iterator 迭代器/partial class 分布类/泛型

    C#:iterator 迭代器/partial class 分布类/泛型 iterator 迭代器 写个最简单的迭代,(迭代一个字符串数组): 1.实现接口中的方法: 1 using System; ...