jquery基础事件
一.常用的事件有:click、dblclick、 mousedown、mouseup、mousemove、mouseover、mouseout、change、select、submit、keydown、 keypress、keyup、blur、focus、load、resize、scroll、error。。。。。
二.Query 通过.bind()方法来为元素绑定这些事件。可以传递三个参数:bind(type,[data],fn):
type 表示一个或多个类型的事件名字符串.
[data]是可选的,作为 event.data 属性值传递一个 额外的数据,这个数据是一个字符串、一个数字、一个数组或一个对象.
fn 表示绑定到指 定元素的处理函数。
前提:jquery包的引入
准备的html:待续
第一部分:添加绑定事件: bind()
1.匿名函数
//使用点击事件
$('input').bind('click',function(){ //点击按钮后执行匿名函数 alert('点击!');
});
解释:给元素绑定click事件,函数为function(){}。
2.普通函数
//普通处理函数 $('input').bind('click',fn); //执行普通函数式无须圆括号 function fn()
{ alert('点击!'); }
解释:通过有函数名来调用。进一步绑定在事件上。
3.同时绑定多个事件
//可以同时绑定多个事件 $('input').bind('mouseout mouseover', function(){ //移入和移出分别执行一次 $('div').html(function(index,value) { returnvalue+''; }); });
4.对象键值对绑定多个参数(函数)
//通过对象键值对绑定多个参数 $('input').bind({ //传递一个对象 'mouseout':function(){ //事件名的引号可以省略
alert('移出'); },
'mouseover':function()
{
alert('移入');
}
});
第二部分:删除绑定事件:unbind()
1.删除所用当前的元素事件
//使用 unbind 删除绑定的事件 $('input').unbind(); //删除所有当前元素的事件
2.删除指定的事件
//使用 unbind 参数删除指定类型事件 $('input').unbind('click'); //删除当前元素的 click 事件
3.删除指定函数
//使用 unbind 参数删除指定处理函数的事件 function fn1(){ alert('点击 1'); } functionfn2(){ alert('点击 2'); } $('input').bind('click',fn1); $('input').bind('click',fn2); $('input').unbind('click',fn1); //只删除 fn1 处理函数的事件
jquery基础事件的更多相关文章
- 9、网页制作Dreamweaver(jQuery基础:事件)
事件 定义 即当HTML中发生某些事(点击.鼠标移过等)的时候调用的方法 $(selector).action() 触发 事件的触发有两种方法: 1.直接将事件click写在<javascrip ...
- Jquery | 基础 | 事件的链式写法
$(".title").click(function () { $(this).addClass("curcol").next(".content&q ...
- 8、网页制作Dreamweaver(jQuery基础:安装、语法)
在<网页制作Dreamweaver(悬浮动态分层导航)>中,运用到了jQuery的技术,轻松实现了菜单的下拉.显示.隐藏的效果,不必再用样式表一点点地修改,省去了很多麻烦,那么jQuery ...
- jQuery事件篇---基础事件
写在前面: 有一段时间未更新博客了,利用这段时间,重新看了<jQuery基础教程 第四版>和<锋利的jQuery 第二版>,这两本书绝对是jQuery入门非常好的书,值得多读几 ...
- 第一百六十九节,jQuery,基础事件
jQuery,基础事件 学习要点: 1.绑定事件 2.简写事件 3.复合事件 JavaScript 有一个非常重要的功能,就是事件驱动.当页面完全加载后,用户通过鼠标 或键盘触发页面中绑定事件的元素即 ...
- jQuery基础之事件
jQuery基础之事件方法,如下图: 代码实现: <script src="JS/jquery-1.12.4.min.js"></script> <s ...
- 【jQuery基础学习】03 jQuery中的事件与动画
关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地 ...
- Jquery基础之事件操作
事件是用户操作时页面或页面加载时引发的用来完成javascript和HTML之间的交互操作.常见的元素点击事件.鼠标事件.键盘输入事件等,较传Javascript 相比JQuery增加并扩展了基本的事 ...
- 基础5.jQuery常用事件
jQuery常用事件 1.bind() 方法 :为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数. 2.blur() 方法:当元素失去焦点时发生 blur 事件. 3.change() ...
随机推荐
- ---Java 678
sudo add-apt-repository ppa:webupd8team/java sudo apt-get update udo apt-key adv --recv-key --keyser ...
- Bitmap简单操作笔记
using System; using System.Collections.Generic; using System.Drawing; using System.Drawing.Imaging; ...
- 常用JS效果 需要时更新。。。
1.手风琴效果 JS: $(function() { var aMenuOneLi = $(".menu-one > li"); var aMenuTwo = ...
- 100 Door Puzzle
问题重述: There are 100 doors in a long hallway. They are all closed. The first time you walk by each do ...
- 处理数组的forEach map filter的兼容性
处理数组的forEach //forEach处理 if(!Array.prototype.forEach) { Array.prototype.forEach = function (callback ...
- Delphi 中记录类型 给记录指针赋值。
PPersion=^TPersion; TPersion=packed record Name:string; Sex:string; Clasee:string; end ...
- [C语言]关于struct和typedef struct
在C中定义一个结构体类型要用typedef: *************************************************************************** t ...
- The user specified as a definer ('root'@'%') does not exist
The user specified as a definer ('root'@'%') does not exist 此种报错主要是针对访问视图文件引起的(没有权限) 解决方法: 2.进入mysql ...
- 五、HTML判断输入长度,体会字体颜色变化
<!doctype html><html lang="en"> <head> <meta charset="UTF-8" ...
- HDMI学习
市面上大多4K显示器都配备了HDMI 1.4接口,仅能实现30Hz的刷新率,不足以带来流畅的显示效果, 酱紫情况,就算是搭配了HDMI 2.0高清线也是无法发挥其作用.只有更先进的HDMI 2.0标准 ...