目前已知有:

$("..").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 绑定事件总结的更多相关文章

  1. jQuery绑定事件-多种方式实现

    jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...

  2. jQuery绑定事件的四種方式

    这篇文章主要介绍的是jQuery绑定事件的四种方式相关内容,下面我们就与大家一起分享. jQuery绑定事件的四种方式 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点 ...

  3. jQuery绑定事件的on()

    jQuery绑定事件 语法:$(selector).on(event,childselector,function(){}); 可以为自身的加事件(一个或多个)  也可以为其子元素加事件(一个或多个) ...

  4. js进阶---12-10、jquery绑定事件和解绑事件是什么

    js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...

  5. Jquery绑定事件及动画效果

    Jquery绑定事件及动画效果 本文转载于:https://blog.csdn.net/Day_and_Night_2017/article/details/85799522 绑定事件 bind(ty ...

  6. 关于jquery绑定事件执行两次

    经常会出现jquery绑定事件执行两次的情况,如: $("a[tag=slide]").click(function () { alert(1); $(this).parent() ...

  7. jquery绑定事件时如何向事件函数里传参数

    jquery绑定事件时如何向事件函数里传参数 jquery绑定事件时如何向事件函数里传参数 举例子说明: 步骤1: var button=$('<button type="button ...

  8. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  9. jQuery绑定事件的四种方式

      jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码.下面我们来看下jQuery中绑定事件的方式都 ...

  10. jquery 绑定事件的方法

    jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) ...

随机推荐

  1. POJ - 2942 Knights of the Round Table (点双联通分量+二分图判定)

    题意:有N个人要参加会议,围圈而坐,需要举手表决,所以每次会议都必须是奇数个人参加.有M对人互相讨厌,他们的座位不能相邻.问有多少人任意一场会议都不能出席. 分析:给出的M条关系是讨厌,将每个人视作点 ...

  2. React setState更新数组中的某个元素Element item

    var items = this.state.items; items[i].status = 'doing'; this.setState({ items: items }); //this.sta ...

  3. svn如何给新文件加锁

    第一步: 右键subversion(版本控制) 第二部:找到 subversion properties 第二部: add进行添加

  4. 【Head First Servlets and JSP】笔记21:从有脚本到无脚本

    可以建立多态的bean引用吗 使用type,但没有class scope属性默认为“page” 从有脚本到无脚本 1.快速搭建一个测试环境:输入用户名,返回“Hello, 用户名” index.htm ...

  5. windows 下android react native详细安装配置过程

    写在前面: 在网上搜了很多安装配置文档,感觉没有一个真的跟我安装的过程一模一样的,东拼拼西凑凑,总算是装好了,我不会告诉你,断断续续,我花了两天时间...一到黑屏报错就傻眼,幸好在react群里遇到了 ...

  6. CentOS 7 安装各个桌面版本

    http://unix.stackexchange.com/questions/181503/how-to-install-desktop-environments-on-centos-7 92dow ...

  7. LeetCode——Maximum Depth of Binary Tree

    LeetCode--Maximum Depth of Binary Tree Question Given a binary tree, find its maximum depth. The max ...

  8. LuManager升级php5.6.27方法

    LuManager自带的PHP在FastCGI模式是 5.2.17版,非FastCGI模式是 5.3.14版.由于360网盘的停服,已不敢再用那些免费的网盘,干脆自己搭个私有云.查了下相关资料准备先试 ...

  9. nginx重新加载配置(不停服)

    RT,改变配置想让它生效而不停止服务,如下两种方式都可以: 1) nginx -t;  nginx -s reload2) nginx -t;  kill -HUP

  10. 从reduce函数说起...

    reduce函数:  方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值, 最终返回的要看函数内部return的内容. 1. 累加器: var ar ...