jQuery里面的常用的事件和基础动画的实现
一:了解jquery里面常用的事件
二:了解基础动画的实现
1:加载DOM
在JavaScript中使用window.onload事件作为窗体加载事件(它在页面所有数据加载完成之后才会执行)
在jQuery里面中使用 $(document).ready(function()) 作为窗体加载事件(在DOM加载完成之后就会执行)
2:事件绑定
在文档加载完成后,可以使用bind()方法来对匹配元素进行特定事件的绑定
bind(type [data],function)
例子:$("div").bind("mouseover mouseout click",function(){ })
unbind() 对匹配的元素进行移除事件的方法 unbind("type") type--事件类型
3:常用的事件
blur 失去焦点 focus 获取焦点 focusin focusout load unload click dblclick mousedown mouseup
mousemove mouseover mouseout mouseenter mouveleave change select submit keydown keypress
keyup error
4: 阻止事件冒泡: event.stopPropagation()
5:触发事件 trigger()
$("#id").trigger("click") 常用模拟触发事件
6:事件对象的属性
event.type ----获取事件类型
event.stopPropagation() -----阻止事件冒泡
event.pageX ---获取光标相对于页面的X坐标
event.pageY --获取光标相对于页面的Y坐标
event.target --获取事件源对象(获取到触发事件的元素)
event.which --在鼠标单击事件中获取鼠标的左中右键
event.metaKey --为键盘事件中获取CTRL键
event.metaKey :jquery1.4以及之前CTRL按下为true 后续版本改为false
7: 动画
show("速度") 显示元素
hide("速度") 隐藏元素
toggle() 切换效果
fadeOut() fadeIn() 这两个方法是改变元素的不透明度(实现隐藏和显示的效果)
slideUp() slideDown() 这两个方法是改变元素的高度
自定义动画:animate(params,speed,function(){ }) //一个包含样式属性及值的映射 速度 在动画完成之后执行的方法
jQuery里面的常用的事件和基础动画的实现的更多相关文章
- jQuery事件篇---基础事件
写在前面: 有一段时间未更新博客了,利用这段时间,重新看了<jQuery基础教程 第四版>和<锋利的jQuery 第二版>,这两本书绝对是jQuery入门非常好的书,值得多读几 ...
- jQuery学习小结1-CSS操作+事件
一.DOM对象和jQuery 对象互换 1.jQuery对象 就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的,其可以使用jQuery里的方法.比如: $(&quo ...
- jQuery入门(3)事件与事件对象
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery文本框中的事件应用
jQuery文本框中的事件应用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...
- 【转载】Python编程中常用的12种基础知识总结
Python编程中常用的12种基础知识总结:正则表达式替换,遍历目录方法,列表按列排序.去重,字典排序,字典.列表.字符串互转,时间对象操作,命令行参数解析(getopt),print 格式化输出,进 ...
- Python编程中常用的12种基础知识总结
原地址:http://blog.jobbole.com/48541/ Python编程中常用的12种基础知识总结:正则表达式替换,遍历目录方法,列表按列排序.去重,字典排序,字典.列表.字符串互转,时 ...
- jQuery中的常用内容总结(一)
jQuery中的常用内容总结(一) 前言 不好意思(✿◠‿◠),由于回家看病以及处理一些其它事情耽搁了,不然这篇博客本该上上周或者上周写的:同时闲谈几句:在这里建议各位开发的童鞋,如果有疾病尽快治 ...
- jQuery中的常用内容总结(三)
jQuery中的常用内容总结(三) 转载请注明地址:http://www.cnblogs.com/funnyzpc/p/7571998.html 内容提要 选择器(第一节) 选择器的扩展方法(第一节) ...
- jQuery中的常用内容总结(二)
jQuery中的常用内容总结(二) 转载请注明地址: http://www.cnblogs.com/funnyzpc/p/7571993.html 前言 距离上次博客更新已经有二十来天了(●′ω`●) ...
随机推荐
- 后端开发实践——Spring Boot项目模板
在我的工作中,我从零开始搭建了不少软件项目,其中包含了基础代码框架和持续集成基础设施等,这些内容在敏捷开发中通常被称为"第0个迭代"要做的事情.但是,当项目运行了一段时间之后再来反 ...
- Python学习笔记1 -- TypeError: 'str' object is not callable
Traceback (most recent call last): File "myfirstpython.py", line 39, in <module> pri ...
- 你真的知道final关键字吗?
概述 final在英文中是最终的,不可更改的.在Java中final修饰变量,函数和类,就像这个单词的意思,一旦使用赋值之后不可更改. final修饰的变量不可以被改变 finalTest类 publ ...
- ABP框架展示异常信息
接触ABP框架有一段时间了,也遇到了一些问题,看了官网文档,但是或许是看的不够细致的原因,实际开发中还是遇到了一些问题,耗费了时间去处理,回头一看,原来文档中早已提及. 开发环境:ABP+MPA模式+ ...
- 一行代码实现数组去重(ES6)
ES6中新增了Set数据结构,类似于数组,但是 它的成员都是唯一的 ,其构造函数可以接受一个数组作为参数,如: let array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3]; ...
- 『Zap Möbius反演』
Zap Description FGD正在破解一段密码,他需要回答很多类似的问题:对于给定的整数a,b和d,有多少正整数对x,y,满足x<=a ,y<=b,并且gcd(x,y)=d.作为F ...
- http/2.0时代已经来临了!
知识分享 文章转自:https://blog.csdn.net/g6U8W7p06dCO99fQ3/article/details/78906348 现在是资源共享的时代,同样也是知识分享的时代,如 ...
- WPF自定义控件创建
WPF自定义控件创建 本文简单的介绍一下WPF自定义控件的开发. 首先,我们打开VisualStudio创建一个WPF自定义控件库,如下图: 然后,我们可以看到创建的解决方案如下: 在解决方案中,我们 ...
- 【开发记录】如何在B/S项目中使用中国天气的实时天气功能
好久没有更新我的博客了,正好手头有一个比较合适的项目经验可以分享出来,就是这个如何使用中国天气的天气预报功能,也正好做个项目经验记录. 功能需求 这个功能需求比较简单,就是想在网页端显示实时天气数据. ...
- html的<h>标签
<h>标签:标题标签. <h>标签只有六个:<h1>........<h6>