JavaScript jQuery 事件、动画、扩展】的更多相关文章

事件 因为JavaScript在浏览器中以单线程模式运行,页面加载后,一旦页面上所有的JavaScript代码被执行完后,就只能依赖触发事件来执行JavaScript代码. 浏览器在接收到用户的鼠标或键盘输入后,会自动在对应的DOM节点上触发相应的事件.如果该节点已经绑定了对应的JavaScript处理函数,该函数就会自动调用. 由于不同的浏览器绑定事件的代码都不太一样,所以用jQuery来写代码,就屏蔽了不同浏览器的差异,我们总是编写相同的代码. 举个例子,假设要在用户点击了超链接时弹出提示框…
事件(Event) 文档事件 文档的载入事件 ready(fn) $(document).ready(function () { }); //或$(function () {}); //或$(document).ready(fn)function fn() { } //或$(document).ready(fn = function () {}); 文档的键盘鼠标事件 keyup(fn) 键盘按下并抬起时发生 $(document).keydown(function () {    alert(…
一:什么是事件委托? 事件委托是利用事件冒泡,只指定一个事件处理程序来管理某一类型的所有事件. 事件委托就是利用事件冒泡原理实现的! 事件冒泡:就是事件从最深节点开始,然后逐步向上传播事件: 例:页面上有一个节点树,div > ul  > li  >  a 比如给最里面的a 加一个click 事件,那么事件就会一层一层的往外执行,执行顺序 a > li > ul > div,  有这样一个机制,当我们给最外层的div 添加点击事件,那么里面的ul , li  , a  …
事件 $(function){} bind(type, [data],function) 事件类型, 传递参数, 处理函数 hover(enter, leave) 光标停留时,函数enter,离开时函数leave toggle(fn1, fn2, fnN...) 点击时,依次调用fn1,fn2,直到结束.再调用fn1 动画 show() 参数为时间.单位毫秒 hide() 同上 fadeIn() 与fadeOut相反 fadeOut() 一定时间内降低元素不透明度,直到消失 slideUp()…
1.引言 现实当中,前台MM收到快递后,她会判断收件人是谁,然后按照收件人的要求签收,甚至代为付款.(公司也不会容忍那么多员工站在门口就为了等快递); 这种事件委托还有个好处,就是即便公司又来很多员工,前台MM照样可以签收新员工的快递,新员工即便刚来但一样拥有拿自己快件的方法: 2.概念 通俗来讲: 事件有:onclick.onmouseover.onmouseout等等:委托呢,就是让别人来做,这件事情本身是加在元素上,然而你却加载别人身上来做,完成事件: 3.原理 利用冒泡原理,将事件加在父…
一.相关知识点总结1.CSS .css()      - .css("color")  -> 获取color css值 - .css("color", "#ff0000") -> 设置值      - .css({"color": "#cccccc", "border": "1px solid #ff0000"})  -> 设置多个值      -…
jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互,能够极大地简化JavaScript编程.它的宗旨就是:“Write less, do more.“ jQuery的优势 一款轻量级的JS框架.jQuery核心js文件才几十kb,不会影响页面加载速度. 丰富的DOM选择器,jQuery的选择器用起来很方便,比如要找到某个DOM对…
jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速运动.缓冲等丰富的动画效果. jQuery Easing是一款比较老的jQuery插件,在很多网站都有应用,尤其是在一些页面滚动.幻灯片切换等场景应用比较多.它非常小巧,且有多种动画方案供选择,使用简单,而且免费. 官网          demo 引入Easing js文件 该插件基于jQuery…
jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速运动.缓冲等丰富的动画效果. jQuery Easing是一款比较老的jQuery插件,在很多网站都有应用,尤其是在一些页面滚动.幻灯片切换等场景应用比较多.它非常小巧,且有多种动画方案供选择,使用简单,而且免费. 查看演示DEMO下载源码 引入Easing js文件 该插件基于jQuery,所以需…
jQuery事件 一.页面载入 当DOM载入就绪可以查询及操纵时绑定一个要执行的函数. 这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度. 简单地说,这个方法纯粹是对向 window.load 事件注册事件的替代方法.通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数,而99.99%的JavaScript函数都需要在那一刻执行. 有一个参数--对jQuery函数的引用--会传递到这个ready事件处理函数中.可以给这个参数任意起一个名字,并因…
1.什么是事件:事件指的是用于对网页操作的时候,网页做出的一个回应. 2.JQuery中的事件:JQuery事件是对JavaScript事件的封装,常用事件的分类如下:(1)基础事件:window事件鼠标事件键盘事件表单事件(2)复合事件是多个事件的组合:鼠标光标悬停鼠标连续点击 3.鼠标事件:click() 鼠标单击时mouseover() 鼠标移过时mouseout() 鼠标移出时 4.键盘事件:keydown() 按下键盘keyup() 放开键盘keypress() 按住不放常用的按键的编…
jQuery  Easing 是一款比较老的jQuery插件,在很多网站都有应用,尤其是在一些页面滚动.幻灯片切换等场景应用比较多.它非常小巧,且有多种动画方案供选择,使用简单,而且免费. 引入Easing js文件 该插件基于jQuery,所以需要同时引入jQuery库文件和Easing js文件. <script type="text/javascript" src="js/jquery.min.js"></script> <scr…
jQuery事件以及动画 一.jQuery事件 加载DOM 在页面加载完毕后, 浏览器会通过 JavaScript 为 DOM 元素添加事件. 在常规的 JavaScript 代码中, 通常使用 window.onload 方法, 在 jQuery 中使用$(document).ready() 方法. 事件绑定 对匹配的元素进行特定的事件绑定: bind() 可以使用 jQuery 的 is() 方法判断元素是否可见 合成事件 hover(): 模拟光标悬停事件. 当光标移动到元素上时, 会触发…
jQuery操作标签 jQuery代码查找标签绑定的变量名推荐使用 $xxxEle 样式类操作 addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名. hasClass();// 判断样式存不存在 toggleClass();// 切换CSS类名,如果有就移除,如果没有就添加. css样式操作 jQuery对象.css('属性名','属性值') $divEle.css('border','5px solid black') 位置 offset…
jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看下面的例子: <!DOCTYPE html> <meta charset="utf-8"> <html> <head> <title>1-1</title> <script type="text/jav…
1.JavaScript事件: 属性 当以下情况发生时,出现此事件 FF N IE onabort 图像加载被中断 1 3 4 onblur 元素失去焦点 1 2 3 onchange 用户改变域的内容 1 2 3 onclick 鼠标点击某个对象 1 2 3 ondblclick 鼠标双击某个对象 1 4 4 onerror 当加载文档或图像时发生某个错误 1 3 4 onfocus 元素获得焦点 1 2 3 onkeydown 某个键盘的键被按下 1 4 3 onkeypress 某个键盘的…
http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs.com/mslove/archive/2010/04/26/1721024.html window.event代表着事件对象的状态.只有在事件发生时生效.如鼠标.键盘等事件被触发时这个对象才存在.window.event这只在IE下是这样的.他并不是标准..也就是说其他浏览器并不支持.在W3C标准支…
一 事件 1 加载DOM事件 $(document).ready():执行时机:DOM元素准备就绪  执行次数:多次  简单写法:原:$(document).ready(function(){})                                    简1:$().ready(function(){})                                    简2:$(function(){}) window.onload(): 执行时机:页面所有元素准备就绪 执行…
总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind.live.delegate.on, 对应的解除监听的函数分别是 unbind.die.undelegate.off. live.delegate 不多用,在Jquery1.7中已经移除,这里不多说 重点介绍 bind.on bind(event,[data],function) bind 是使用频率较高的一种,作用就是在选择到的…
jQuery 的动画方法(animate)支持各种属性的过渡,但是默认并不支持色彩的过渡,该插件正是来补足这一点! PS: 该插件支持 RGBA 颜色的过渡,但是请注意,IE8以下的版本不支持 RGBA 颜色. 支持以下属性: color backgroundColor borderColor borderBottomColor borderLeftColor borderRightColor borderTopColor outlineColor 使用方法: 载入 JavaScript 文件…
元旦过后,新年第一篇. 初衷:很多的面试都会涉及到事件委托,前前后后也看过好多博文,写的都很不错,写的各有千秋,自己思前想后,为了以后自己的查看,也同时为现在找工作的前端小伙伴提供一个看似更全方位的解读事件委托的地方来认识了解他的原理,本篇文章汇总了两个版本的事件委托:javascript.jquery; 事件委托的定义: 利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件. 事件委托的优势: 在js中添加到页面上的事件处理程序的个数直接影响到网页的运行性能.因为每个事件处理函数…
Js和jq事件—键盘事件KeyboardEvent 键盘事件keydown,keypress和keyup,还需要涉及到一个文本事件textInput. keydown,keypress和keyup事件在js和jq中都支持.但是你想要触发这三个事件,必须有文本输入操作(该元素是,或者包含的子元素是文本输入元素—通过冒泡触发). 三个事件的触发顺序是按下键盘会触发keydown,keypress,如果按着键盘不放则会反复触发这两个事件,当放开键盘的时候触发keyup.对于键盘上每个按键,这三个事件都…
javascript使用mouseover和mouseout,只在css中支持hover jquery支持mouseover和mouseout,封装了mouseenter.mouseleave事件函数和hover函数 1.有关js中的mouseover和mouseout 原生js的事件类型是mouserout和mouseover,之前提到的事件冒泡的缺陷就在这里,之前说的使用阻止冒泡就行,大概说得太轻易.来理一理它们的触发顺序吧. <div id=”f1”> <div id=”c1”&g…
http://blog.csdn.net/pigpigpig4587/article/details/24727791 jQuery事件命名空间 jQuery支持事件命名空间,以方便事件管理.例如,在下面的示例中,为div元素绑定多个事件类型,然后使用命名空间进行规范,从而方便管理.所谓事件命名空间,就晨事件类型后面以点语法附加一个别名,以便引用事件,如"click.a",其中"a"就是click当前事件类型的别名,即事件命名空间 如:$("div&quo…
一. 事件委托什么是事件委托?用现实中的理解就是:有100 个学生同时在某天中午收到快递,但这100 个学生不可能同时站在学校门口等,那么都会委托门卫去收取,然后再逐个交给学生.而在jQuery 中,我们通过事件冒泡的特性,让子元素绑定的事件冒泡到父元素(或祖先元素)上,然后再进行相关处理即可.如果一个企业级应用做报表处理,表格有2000 行,每一行都有一个按钮处理.如果用之前的.bind()处理,那么就需要绑定2000 个事件,就好比2000 个学生同时站在学校门口等快递,不断会堵塞路口,还会…
jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 jQuery.event={ global:{}, add:function(elem,types,handle,data,selector){}, remove:function(elem,types,handler,selector,mapppedTypes){}, trigger:functio…
第一篇 http://www.cnblogs.com/aaronjs/p/3444874.html 从上章就能得出几个信息: 事件信息都存储在数据缓存中 对于没有特殊事件特有监听方法和普通事件都用addEventListener来添加事件了. 而又特有监听方法的特殊事件,则用了另一种方式来添加事件. 本章分析的重点: 通过addEventListener触发事件后,回调句柄如何处理? 具体来说就是,如何委派事件的,用到哪些机制,我们如果用到项目上是否能借鉴? 涉及的处理: 事件句柄的读取与处理…
animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jquery/index.htm animate()在jquery中作为一个方法,可用于创建动画效果 以下是实例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o…
最近一年多一直在做前端的东西,由于老板在追求一些年轻动感的效果,让页面元素不能仅仅是简单的隐藏显示,所以经常会使用一些动画效果,发现jQuery的动画真心好用啊,把常用的几个总结一下,希望不再每次使用的时候还去翻API queue()/ dequeue() 这两个方法就像Ajax的XMLHttpRequest对象一样的隐蔽,不为常人所知.这两个方法在动画处理的时候很有用,我们经常会写一些这样的代码 $('#test').animate({ "width": "300px&qu…
什么是事件 页面对不同访问者的响应叫做事件. 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法. 常见 DOM 事件: 鼠标事件 键盘事件 表单事件 文档/窗口事件 click keypress submit load dblclick keydown change resize mouseenter keyup focus scroll mouseleave   blur unload 事件绑定 文档装载完成后,如果打算为元素绑定事件来完成某些操作,则可以使用on()方法来对被选元…