1.绑定所有的<p>元素
// 为所有P元素分别绑定click事件处理函数handler
$("p").on("click", handler);
2.为div中所有的P元素绑定click事件
// 为div中的所有p元素绑定click事件处理程序,对后面append添加的p也有用
$("div").on("click", "p", function(){
    // 这里的this指向触发点击事件的p元素(Element)
    alert( $(this).text() );
});
// 在body元素上绑定click事件处理函数handler,如果这个click事件是由其后代的P元素触发的,就执行handler
$(document.body).on("click", "p", handler);
注意:"focus"、"blur"等部分事件不支持冒泡,使用事件委托机制将无效。不过,他们一般也有对应的支持冒泡的事件。例如与"focus"对应的"focusin",与"blur"对应的"focusout"。此外,我们也可以使用event.stopPropagation()方法,让当前触发的事件停止冒泡。
3.为元素绑定多个事件并为其传入附件数据
<p id="n5">Google</p>
var data = { id: 5, name: "张三" };

var events = {
    "mouseenter": function(event){
        $(this).html( "你好," + event.data.name + "!");      
    },
   
    "mouseleave": function(event){
        $(this).html( "再见!");
    }      
}; //为n5绑定mouseenter mouseleave两个事件,并为其传入附加数据data
$("body").on(events, "#n5", data);

 

jQuery.on() 函数的更多相关文章

  1. 图片放大功能插件及jquery.extend函数理解

    前端时间,产品提出社区评论中的图片需要有放大功能.感觉可以共用,所以就想整合一个插件,过程中也借鉴了一些例子. 分析下自己的代码思路: var scaleImg = function(opts) { ...

  2. jquery each函数 break和continue功能

    jquery each函数 break和continue功能幸运的是另一个突破,持续一个jQuery循环方式.你可以打破在函数返回一个jQuery参数虚假循环.一个可以继续执行只是在做不指定返回值或返 ...

  3. jQuery 遍历函数

    转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...

  4. 关于jquery中用函数来设置css样式

    关于jquery中用函数来设置css样式 2016-12-21 23:27:55 1.jquery语法 $(selector).css(name,function(index,value)) name ...

  5. jQuery.attr() 函数详解

    一,jQuery.attr()  函数详解: http://www.365mini.com/page/jquery-attr.htm 二,jQuery函数attr()和prop()的区别: http: ...

  6. jQuery.noConflict() 函数

    jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权. 一般情况下,在jQuery库中,变量$是变量jQuery的别名,它们之间是等价的,例如jQue ...

  7. jQuery.ajax() 函数详解

    jQuery.ajax()函数用于通过后台HTTP请求加载远程数据. jQuery.ajax()函数是jQuery封装的AJAX技术实现,通过该函数,我们无需刷新当前页面即可获取远程服务器上的数据. ...

  8. Jquery核心函数

    在Jquery中,所有的DOM对象都将封装成Jquery对象,而且只有Jquery对象才能使用Jquery方法或者属性来执行相应的操作. 所以Jquery提供了一个可以将DOM对象封装成Jquery对 ...

  9. jQuery.makeArray() 函数详解

    jQuery.makeArray()函数用于将一个类数组对象转换为真正的数组对象. 所谓"类数组对象"就是一个常规的Object对象,但它和数组对象非常相似:具备length属性, ...

  10. jQuery基础之(三)jQuery功能函数前缀及与window.onload冲突

    1.jQuery功能函数前缀 在javascript中,开发者通常会编写一些小函数来处理各种操作细节,例如在用户提交表单时,要将文本框最前端和最末端的空格内容清理掉.而javascript中没有类似t ...

随机推荐

  1. Ajax 访问 或 获取 IIS 虚拟目录

    使用场景 最近用 .net core mvc 写了一个工具类的项目,作为我们项目的后台管理网站使用.第一次被老大拿去部署的时候被告知不可用,同样的代码在我电脑和我的iis上都可以使用的啊. 后来才知道 ...

  2. json--pyton中obj与json的互转,js中obj与json的互转

    json 解释:json是一种跨平台的通用的数据格式 python中对象(obj)与json之间的相互转换 1.对象(obj)转json格式的字符串 json.dumps(res) res = () ...

  3. CodeForces 540C Ice Cave (BFS)

    http://codeforces.com/problemset/problem/540/C       Ice Cave Time Limit:2000MS     Memory Limit:262 ...

  4. gridview获取选中行索引及当前行数据

    gridview获取选中行索引及当前行数据 一.非直接绑定数据: <!--前台传值--> <asp:TemplateField HeaderText="操作"&g ...

  5. 蒲公英(bzoj2724)(分块+区间众数)

    Input Output Sample Input 6 3 1 2 3 2 1 2 1 5 3 6 1 5 Sample Output 1 2 1 HINT \(n <= 40000\),$ m ...

  6. Django(图书管理系统1)

    day63 内容回顾     1. 单表的增删改查         1. 删和改             1. GET请求 URL传值                 1. 格式            ...

  7. FunDA(11)- 数据库操作的并行运算:Parallel data processing

    FunDA最重要的设计目标之一就是能够实现数据库操作的并行运算.我们先重温一下fs2是如何实现并行运算的.我们用interleave.merge.either这几种方式来同时处理两个Stream里的元 ...

  8. Python任意网段Web端口信息探测工具

    此篇关于多线程工具的文章,非常适合新手学习,工具效率也挺高的,代码也比较完善,如题. 本文作者:i春秋签约作家——Aedoo 0×00 前言 笔者前一段时间发布了原创文章,“[Python黑客] Py ...

  9. beyondCompare试用期到期解决办法

    找到beyond Compare 4文件夹下面的BCUnrar.dll,将其删掉或者重命名,再重新打开接着使用! 我这是转的,到期之后试试.

  10. OO第一单元作业

    第一次作业 类图:   复杂度: 圈复杂度的问题一直困扰着这三次作业,主要体现在求导方法中先判断符号导致出现过多判断语句,应该将整理符号放在一个新的类中处理. 第一次作业由于对面向对象的思维有些不理解 ...