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加载元素,接着解 ...
随机推荐
- PHP正则表达式中的反斜线
PHP反斜线再正则表达式中的使用 <?php $str = 'hello\world'; $pattern = '/hello\\\\world/'; preg_match($pattern,$ ...
- CF1220F
CF1220F 把整棵树分成1的左边和1的右边两部分 最优情况两边子树深度的差一定可以是一 如果还可以是2,也可以通过把多的那一边的点往另一边移使他变成1 如果往一个端点加点,一定不会使这一边变优,也 ...
- ubuntu中搭建基本的开发环境
1.搭建基本开发环境: sudo apt-get install build-essential 2.安装语法.词法分析器 sudo apt-get install bison flex 3.安装C函 ...
- adb基本操作
用途 命令 备注 安装app adb install xxx.apk -l 锁定该应用程序-r 替换已存在的应用程序,也就是说强制安装-t 允许测试包-s 把应用程序安装到sd卡上-d 允许进行降级安 ...
- 2018年分享的Spring Cloud 2.x系列文章
还有几个小时2018年就要过去了,盘点一下小编从做做公众号以来发送了273篇文章,其中包含原创文章90篇,虽然原创的有点少,但是2019年小编将一如既往给大家分享跟多的干货,分享工作中的经验,让大家在 ...
- 前端移动端开发总结(Vue)
上下固定,中间滚动布局(FLEX) <div id="app"> <div class="header"></div> &l ...
- vCenter 6.0 vsca 安装遇到的一些小问题
在安装vCenter 6.0 vsca的时候,安装插件到第二个的时候,会报出一个windows installer的错误.需要联系软件管理员或者技术支持的一个error. 经过多次的测试,我终于找到了 ...
- Bash: Removing leading zeroes from a variable
old=" # sed removes leading zeroes from stdin new=$(echo $old | sed 's/^0*//')
- Tomcat 配置访问限制：访问白名单和访问黑名单
最近公司的阿里云服务器上配置的 Tomcat 服务器运行 java的环境,但是通过观察 Tomcat 这几天的日志发现,有很多莫名其妙的 IP 访问主机下莫名其妙的地址,如:/80./testprox ...
- 利用Python批量重命名一系列文件名杂乱的文件
假设目录下面有这样一系列命令杂乱的文件: OPENFOAM -TRAINING- PART- #1.pdf OPENFOAM - TRAINING- PART- #2.pdf OPENFOAM- TR ...