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 前言 距离上次博客更新已经有二十来天了(●′ω`●) ...
随机推荐
- python+appium 【已解决】真机运行appium报错“WebDriverException: Message: A new session could not be created. (Original error: Command failed: C:\Windows\system32\cmd.exe /s /c.......详见内文
问题报错提示: selenium.common.exceptions.WebDriverException: Message: A new session could not be created. ...
- Python基础练习题100例(Python 3.x)
1:题目:有四个数字:1.2.3.4,能组成多少个互不相同且无重复数字的三位数?各是多少? 程序分析:可填在百位.十位.个位的数字都是1.2.3.4.组成所有的排列后再去 掉不满足条件的排列. 程序源 ...
- php架构之路
鉴于最近跟小伙伴聊了很多PHP架构发展方向的问题,相关技术整理了一下,也顺便规划了一下自己的2019年. 一.常用的设计模式以及使用场景 以下是我用到过的 工厂,单例,策略,注册,适配,观察者,原 ...
- asp.net core系列 57 IS4 使用混合流(OIDC+OAuth2.0)添加API访问
一.概述 在上篇中,探讨了交互式用户身份验证,使用的是OIDC协议. 在之前篇中对API访问使用的是OAuth2.0协议.这篇把这两个部分放在一起,OpenID Connect和OAuth 2.0组合 ...
- css实现发光文字,以及一点点js特效
效果图: 代码如下: </head> <style> body{ background-color:#000; } .textArea{ font-size:100px; co ...
- DataPipeline丨金融行业如何统一管理单个任务下所有API的同步情况
目前,依靠"手工人力"的电子表格数据治理模式逐渐被"自动智能"的专业工具取代.数据管理员.业务分析师开始采用"平台工具"来梳理主数据.元数据 ...
- iOS----------学习路线思维导图
UI相关 Runtime OC特性 内存管理 Block 多线程 Runloop 网络相关 设计模式 架构 算法 第三方库
- Android之PhotoView使用
文章大纲 一.什么是PhotoView二.代码实战三.项目源码下载 一.什么是PhotoView 一款 ImageView 展示框架,支持缩放,响应手势,位于图片排行榜的第五位,PhotoView ...
- 【技术讨论】RF环境搭建手册
(原创文章,转载请注明出处.) 简要整理下环境搭建的步骤,以便快速.准确的搭建测试环境. 一.环境搭建 一.Python 2.7 1. 不要用Python3.6,很多库3.6中还没有,wxPython ...
- centos7 ambari安装HDP
环境介绍:操作系统为Centos7.1:测试设备全部为内网设备,不通公网,所以需要配置本地yum源: 首先安装ansible工具,用来批量安装ambari.java以及基础的一些配置: 一. 免密钥登 ...