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 前言 距离上次博客更新已经有二十来天了(●′ω`●) ...
随机推荐
- selenium IDE中log的保存与查看方法
下载selenium IDE的log保存插件为File Logging(selenium IDE),下载安装方式如下: (1)打开firefox浏览器----点击右上角----附加组件---插件--- ...
- 微信小程序中placeholder的样式
通常,现代浏览器大多支持::placeholder选择器,用于设置placeholder的样式,但是在微信小程序中并不支持这种方式,而是提供了一个专门的属性(placeholder-class)来处理 ...
- CTF丨2019互联网安全城市巡回赛·西安站,我们来了!
万物互联时代,网信事业发展突飞猛进,互联网悄然渗透到国民生活的每一个角落,伴随而来的网络安全威胁和风险也日渐突出.网络诈骗.钓鱼软件.勒索病毒等安全问题层出不穷,信息泄露等网络安全事件也频繁上演,给用 ...
- 10位时间戳使用moment转化为日期
前情提要: 需要把后台传过来的10位时间戳转化格式为:‘YYYY-MM-DD HH:mm:ss’的日期展示在页面上.本来是自己写了个函数,但是奈何leader说我们项目用了moment了,你为什么不用 ...
- 小白学习Python之路---re模块学习和挑战练习
本节大纲: 1.正则表达式 2.re模块的学习 3.速记理解技巧 4.挑战练习--开发一个简单的python计算器 5.心得总结 6.学习建议 正则表达式: 正则表达式,又称规则表达式.(英语:Reg ...
- TensorFlow从1到2(五)图片内容识别和自然语言语义识别
Keras内置的预定义模型 上一节我们讲过了完整的保存模型及其训练完成的参数. Keras中使用这种方式,预置了多个著名的成熟神经网络模型.当然,这实际是Keras的功劳,并不适合算在TensorFl ...
- wGenerator代码生成工具
由来 以前一直用window系列的操作系统,有不少可以用的代码生成工具,如:动软的代码生成器(.net),可以自定义模板,然后按需生成代码.后来用mac系统,发现好像没有什么太好用的生成工具,所以自己 ...
- 基于CNN的人群密度图估计方法简述
人群计数的方法分为传统的视频和图像人群计数算法以及基于深度学习的人群计数算法,深度学习方法由于能够方便高效地提取高层特征而获得优越的性能是传统方法无法比拟的.本文简单了秒速了近几年,基于单张图像利用C ...
- Linux也有后悔药,五种方案快速恢复你的系统
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由信姜缘 发表于云+社区专栏 新手在学习Linux系统的时候,难免会遇到命令输错,或系统出错的难题.那么如何快速解决呢?本文就先给你一个 ...
- DSAPI 网页获取本地程序登陆用户
这是一个非常简单的示例,在网页或其他平台获取程序中已经登陆的用户,当然也可以是其他信息. 源码 Imports DSAPI.网络.HTTP监听_DSWebAPI Public Class Form1 ...