jQuery 绑定事件总结
目前已知有:
$("..").bind("事件名",fn);
$("parent").on("事件名","selector",fn);
$("..").one("事件名",fn);
DOM:addEvenetlistener("事件名",fn);
removeEvenetListener("事件名",函数名);
强调:要想移除事件监听,必须使用有名函数
绑定事件监听,如果添加事件时使用匿名函数
则不可能移除.
$("select").live("事件名",fn);
$(document).delegate("select","事件",fn);
$("selector").die("事件名");
其中 后三种 live、delegate、die,由于其本身的性能问题,已废弃,不再讨论,尽讨论前三种:
1:bind
bind通常都是是每个子元素都添加事件监听,且仅对现有元素添加绑定,无法自动给动态生成元素添加绑定
a:
$("...").bind("事件名",fn);
$("...").bind("事件名1 事件名2 ",fn);
b:事件对象
$("..").bind("事件名",function(e){
e==事件对象
e.preventDefault();
});
$("..").unbind("事件名",函数名); 解除绑定
$("..").unbind(); 移动该元素上所有事件绑定
2:on
on() 为指定的元素,添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。使用 on() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。
off()函数主要用于解除由on()函数绑定的事件处理函数。
3:one
$("..").one("事件名",fn);绑定事件,仅触发一次后自动触绑定,只能对当前页面上己存在的元素添加事件绑定.动态生成元素无法自动绑定事件.
实现动态绑定的方法:
解决1:利用冒泡,将事件绑定己存在父元素一次
function(e){
var target = e.target;
//target 触发事件:元素
}
解决2:事件代理
$("parent").delegate("subselector","事件名",fn);
fn-->this--->代替 e.target
解除
$("parent").undelegate("subselector","事件名");
jQuery 绑定事件总结的更多相关文章
- jQuery绑定事件-多种方式实现
jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...
- jQuery绑定事件的四種方式
这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...
- jQuery绑定事件的on()
jQuery绑定事件 语法:$(selector).on(event,childselector,function(){}); 可以为自身的加事件(一个或多个) 也可以为其子元素加事件(一个或多个) ...
- js进阶---12-10、jquery绑定事件和解绑事件是什么
js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...
- Jquery绑定事件及动画效果
Jquery绑定事件及动画效果 本文转载于:https://blog.csdn.net/Day_and_Night_2017/article/details/85799522 绑定事件 bind(ty ...
- 关于jquery绑定事件执行两次
经常会出现jquery绑定事件执行两次的情况,如: $("a[tag=slide]").click(function () { alert(1); $(this).parent() ...
- jquery绑定事件时如何向事件函数里传参数
jquery绑定事件时如何向事件函数里传参数 jquery绑定事件时如何向事件函数里传参数 举例子说明: 步骤1: var button=$('<button type="button ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
- jQuery绑定事件的四种方式
jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...
- jquery 绑定事件的方法
jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) ...
随机推荐
- 基于WinIO 3.0实现驱动级键盘模拟输入
基于WinIO 3.0实现驱动级键盘模拟输入 一个业务场景需要使用驱动级的键盘模拟,折腾了2天,总结一下,为后人节省时间. 限制条件: 1.需要真实PC机,虚拟机不行 2.仅支持PS/2 键盘(指外接 ...
- hadoop21---使用代理修改List,代理流程
package cn.itcast_05_proxy; import java.lang.reflect.InvocationHandler; import java.lang.reflect.Met ...
- 理解音视频 PTS 和 DTS
视频 视频的播放过程可以简单理解为一帧一帧的画面按照时间顺序呈现出来的过程,就像在一个本子的每一页画上画,然后快速翻动的感觉. 但是在实际应用中,并不是每一帧都是完整的画面,因为如果每一帧画面都是完整 ...
- HDU4627
/*找规律,n是奇数那么就是n/2和n/2+1 如果n是偶数,那就是两种情况n/2-1,和n/2-2两种,比较一下大小就可以 思路来自:http://www.cnblogs.com/freezhan/ ...
- HTML5抽奖转盘
在线演示 本地下载
- install tabix/bgzip
bgzip – Block compression/decompression utility tabix – Generic indexer for TAB-delimited genome pos ...
- 企业微信小程序--从零开始(带你见证从头开始的企业小程序之开发运营)
1.注册微信小程序账户(自己摸索吧很简单的) 2.微信小程序认证 3.遇到的问题 1)
- <<Hadoop基础教程》之初识Hadoop【转】
Hadoop一直是我想学习的技术,正巧最近项目组要做电子商城,我就开始研究Hadoop,虽然最后鉴定Hadoop不适用我们的项目,但是我会继续研究下去,技多不压身. <Hadoop基础教程> ...
- css3 放大缩小代码
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- python学习笔记(pict+requests+xml)
博主尝试了下更换python版本 之前很多脚本改正运行错误后.还是不能正常运行 忙会了半天还是没有成功 只好还原版本 所以下面的代码还没实际运行成功.先记录下 #!/usr/bin/env pytho ...