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. 论文笔记(4)-Deep Boltzmann Machines

    Deep Boltzmann Machines是hinton的学生写的,是在RBM基础上新提出的模型,首先看一下RBM与BM的区别 很明显可以看出BM是在隐含层各个节点以及输入层各个节点都是相互关联的 ...

  2. spring mvc配置ObjectMapper忽略无法识别的字段,以及一些博客推荐

    通过Spring的MethodInvokingFactoryBean类实现的调用configure方法,此方法返回调用该方法的本身实例. 配置完毕后,可以在spring mvc的消息处理器中使用,为了 ...

  3. 如何连接MSSQLSERVER2014(其他版本数据库大体相同)

    购买了服务器后我在上面安装了SqlServer2014,但是程序中总是远程连接不上,特此记录一下: 一.一些基本设置如下链接: 转载自:https://blog.sun0816.com/20381.h ...

  4. net生成图片验证码--转自Lisliefor

    目前,机器识别验证码已经相当强大了,比较常见的避免被机器识别的方法,就是将验证码的字符串连到一起,这样就加大的识别的难度,毕竟机器没有人工智能.我找了很多的.net生成图片验证码的例子,后来经过一些修 ...

  5. Angular6 学习笔记——指令

    angular6.x系列的学习笔记记录,仍在不断完善中,学习地址: https://www.angular.cn/guide/template-syntax http://www.ngfans.net ...

  6. Spring 开发第一步(四)Spring与JDBC事务

    Spring使用各种不同的TransactionManager来管理各种不同数据源事务底层(比如jdbc数据源.hibernate数据源.JPA数据源等等).在此基础上使用各种对应的Template来 ...

  7. 20164317 《网络对抗技术》Exp5 MSF基础应用

    基础问题回答 (1)用自己的话解释什么是exploit,payload,encode. exploit: 是指攻击者或渗透测试者利用一个系统.应用或服务中的安全漏洞所进行的攻击行为, 包括利用缓冲区溢 ...

  8. JQuery Mobile - 如何让listview不显示向右的箭头?

    先看一下有向右箭头的截图吧 这个listview第二个项目,就有向右的箭头,如果单纯显示具体数据,没有扩展显示的内容,那么这个向右的箭头就是多余的,在这种情况下,最好是去掉这个向右箭头,程序中已经在第 ...

  9. 847. Shortest Path Visiting All Nodes

    An undirected, connected graph of N nodes (labeled 0, 1, 2, ..., N-1) is given as graph. graph.lengt ...

  10. 638. Shopping Offers

    In LeetCode Store, there are some kinds of items to sell. Each item has a price. However, there are ...