jQuery笔记（事件绑定和解绑）
事件绑定
一、bind()
1.传两参数 第一个参数是事件名，第二个是事件处理函数
2.传键值对(对象)
<body>
<input type="button" value="点我" id="btn">
</body>
$("#btn").bind("click",function () {
alert("我不要你觉得，我要我觉得");
});
//或写成键值对(对象)
$("#btn").bind({"click":function () {
alert("我不要你觉得，我要我觉得");
}});
//多个事件共用一个事件处理函数的时候，还可以这样写
$("#btn").bind({"mouseover mouseout":function () {
$(this).append("<p>我不要你觉得，我要我觉得</p>")
}});
二、delegete()
delegete() 与bind()相似
差别在于这个函数是给子元素绑定函数
参数：1.要绑定事件的子元素
2.事件
3.事件处理函数 三、on()
最推荐使用的事件绑定方法，主流
结合了bind和delegate两者的用途
两个参数时：（类似于bing）
1.事件名
2.事件处理函数
三个参数：（类似于delegate）
1.事件名
2.绑定事件的子元素
3.事件处理函数
以下两种写法，实现的效果都是一样的噢
<div id="dv">
<button>冰箱不够怎么办</button>
</div>
//第一种写法
$("#dv button").on("click",function () {
alert("买！");
});
//第二种写法
$("#dv").on("click","button",function () {
alert("买！");
});
事件解绑
有绑定就有解绑
* on<=>off
* delegate<=>undelegate
* bind<=>unbind
* 注意：解绑时，只会解绑自身事件，不会将子级的事件解绑。 关于冒泡，可以通过return false可以避免冒泡
总结：
* bind():
* 1.$("绑定事件的元素").bind("事件",事件处理函数);
* 2.$("绑定事件的元素").bind({"事件1",事件处理函数1,"事件2",事件处理函数2,..."事件n",事件处理函数n});
* delegate():
* $("父级元素").delegate("子级元素","事件",事件处理函数);
* on():
* 1.$("绑定事件的元素").on("事件",事件处理函数);
* 2.$("绑定事件的元素").on({"事件1",事件处理函数1,"事件2",事件处理函数2,..."事件n",事件处理函数n});
* 3.$("父级元素").on(""事件",子级元素",事件处理函数);
* on<=>off
* delegate<=>undelegate
* bind<=>unbind
jQuery笔记（事件绑定和解绑）的更多相关文章
- python 全栈开发，Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))
一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...
- 前端 -----jQuery的事件绑定和解绑
11-jQuery的事件绑定和解绑 1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (S ...
- jQuery的事件绑定和解绑
1.绑定事件 $('获取的标签对象').bind('要操作的方法, {操作的内容 是字典的形式},function(){} ') 语法: bind(type,data,fn) 描述:为每一个匹配元 ...
- 10 jQuery的事件绑定和解绑
1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...
- jQuery系列（十一）：jQuery的事件绑定和解绑
1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...
- python全栈开发day49-jquery的位置信息、事件流、事件对象，事件委托，事件绑定和解绑
一.昨日内容回顾 1. jQuery的属性操作 1) html属性操作:attr 2) DOM属性操作:prop 3) 类样式操作:addClass.removeClass.toggleClas ...
- 11-jQuery的事件绑定和解绑
1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...
- jQuery绑定和解绑点击事件及重复绑定解决办法
原文地址:http://www.111cn.net/wy/jquery/47597.htm 绑点击事件这个是jquery一个常用的功能,如click,unbind等等这些事件绑定事情,但还有很多朋友不 ...
- 原生js绑定和解绑事件,兼容IE,FF,chrome
主要是最近项目中用到了原生的js 解绑和绑定 事件 然后今天研究了一下,其实问题不大,不过要注意不要把单词写错了,今天我就找了好久单词写错了. 需求:当鼠标移上去以后,给Select加载元素,接着解 ...
随机推荐
- leetcode.矩阵.566重塑矩阵-Java
1. 具体题目 给出一个由二维数组表示的矩阵,以及两个正整数r和c,分别表示想要的重构的矩阵的行数和列数.重构后的矩阵需要将原始矩阵的所有元素以相同的行遍历顺序填充.如果具有给定参数的reshape操 ...
- 24-python基础-python3-浅拷贝与深拷贝（2）
4.copy 模块的 copy()和 deepcopy()函数 在处理列表和字典时,尽管传递引用常常是最方便的方法,但如果函数修改了传入的列表或字典,可能不希望这些变动影响原来的列表或字典.要做到 ...
- rookit入門
来源:rootkit_com 作者:Clandestiny 翻译:fqh “Help!我是一名新手!我需要一款rootkit入侵朋友的机器…我想编写自己的rootkit…我想开始开发代码… 该从哪里入 ...
- CF1158C
题意:有排列p, 令\(nxt_i\)为\(p_i\)右侧第一个大于\(p_i\)的数的位置,若不存在则\(nxt_i=n+1\) 现在整个p和nxt的一部分丢失了,请根据剩余的nxt,构造出一个符合 ...
- px2rem-loader（Vue:移动端自适应，px自动转化）
1.下载lib-flexible npm i lib-flexible --save 2.引入lib-flexible import 'lib-flexible/flexible' 3.设置meta标 ...
- ASP.NET MVC 学习笔记之TempData、HttpContext和HttpContextBase杂谈
TempData本质上是Session 但是有一点不同的是,TempData被赋值之后,一旦被Action访问一次之后,马上就会清空. System.Web.HttpContext 和System.W ...
- ionic3 动态设置tabs页面底部导航栏隐藏，并显示输入框添加评论
1.先上原始效果图: 2.完成后效果 2.实现思路: ion ...
- hibernate调用oracle存储过程||函数
pakeage dao.Impl; //调用函数FUN_GET(); public String get(String Id,String Name){ return getSession().cre ...
- lua 线程
{ //https://blog.csdn.net/gulan0/article/details/50373276 }
- 如何修改magento分类页面的产品的显示个数
经常的有客户问,怎么修改分类页面的产品的个数 这个是magneto后台操作的设置问题 打开后台,在英文状态下: system-->configuration 进入后,点击catalog Prod ...