on方法在1.7版本中开始出现的,现在已经优先考虑on,并不是bind方法了。

on( events [,selector] [,data] ,handler)

  event:为事件类型,可以有多个事件类型。

  selector:可选,过滤绑定在on方法上的后代元素。注:如果有selector,on方法是采用事件代理,这样可以提升代码性能。

  data:可选,当事件被触发时,它会传给event.data,从而可以加以利用

  handler:当事件被触发时,执行的方法。

$(document).on("blur","#padRadius",{name:"vichin"},function(event){
alert(event.data.name)
});
$(document).on("blur", "#padRadius", function () {
alert("hello word!");
});

等同于bind的用法

$("#div1").on("click",function(){
alert("Hello word");
});

$("#div1").click(function(){

});

这种写法在1.7之前是bind的简写,在1.7之后,就是on的简写

解绑:

$("#div1").off("click");

jquery 使用on方法给元素绑定事件的更多相关文章

  1. WEB前端技巧之JQuery为动态添加的元素绑定事件.md

      jquery 为动态添加的元素绑定事件 如果直接写click函数的话,只能把事件绑定在已经存在的元素上,不能绑定在动态添加的元素上 可以用delegate来实现 .delegate( select ...

  2. jQuery中对未来的元素绑定事件

    对未来的元素绑定事件不能用bind, 1.可以用live代替,但是要注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了. 2.推荐用on代 ...

  3. jQuery 为动态添加的元素绑定事件

    在使用jquery的方式为元素绑定事件时,我经常使用bind或者click,但这只能为页面已经加载好的元素绑定事件.像需要用ajax的方式请求远程数据来动态添加页面元素时,显然以上几种绑定事件的方式是 ...

  4. jQuery中对未来的元素绑定事件用bind、live or on

    对未来的元素绑定事件不能用bind, 1.可以用live代替,但是要注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了. 2.推荐用on代 ...

  5. jQuery给动态添加的元素绑定事件的方法

    我们在开发过程会遇到无法给动态元素添加绑定事件,解决方案如下: 例如 <div id="testdiv">   <ul></ul> </d ...

  6. jQuery对 动态添加 的元素 绑定事件(on()的用法)

    从jQuery 版本 1.7 起,on() 方法是向被选元素添加事件处理程序的(官方推荐)首选方法. 当浏览器下载完一个页面的时候就开始渲染(翻译)HTML标签,然后执行css.js代码,在执行js代 ...

  7. jquery给动态生成的元素绑定事件,on函数

    首先先解释一下什么是动态生成的元素:动态生成的元素即我们用jquery的内部插入函数append()所生成的html代码.相对的也有静态生成的元素:即直接编写在页面的html代码. 下面通过例子来讲解 ...

  8. jquery append 动态添加的元素绑定事件on

    用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...

  9. jquery html动态添加的元素绑定事件详解

    在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况: <div id="testdiv"> <ul></ul> </div&g ...

随机推荐

  1. EJS学习(一)之特性、安装、工作原理

    前言 EJS,"E" 代表 "effective",即[高效],EJS 是一套简单的JavaScript模板,EJS 没有如何组织内容的教条:也没有再造一套迭代 ...

  2. 01 Mysql数据库初识

    一.数据库概述 1.什么是数据库? 什么是数据库呢? 先来看看百度怎么说的 数据库,简而言之可视为电子化的文件柜——存储电子文件的处所,用户可以对文件中的数据运行新增.截取.更新.删除等操作. 所谓“ ...

  3. symfony2学习笔记——控制器

    //获取get过来的参数 $val = $request->query->get('aaa'); //获取post过来的参数 //$val = $request->request-& ...

  4. CentOS7 配置NFS(Network File System)及其使用

    1.       服务端配置 1.1.    安装NFS yum -y install nfs* 1.2.    查看是否安装了NFS与RPCBIND rpm -qa | grep nfs rpm - ...

  5. glsl:error C1105: cannot call a non-function

    今天写的shader编译过程中报了这个错误,而且错误行数是0.原因怎么找也找不到.后来发现原来是normalize方法写成了了normal正好和函数的形参名字一样. 特地记录一下.

  6. 浙大数据结构课后习题 练习二 7-3 Pop Sequence (25 分)

    Given a stack which can keep M numbers at most. Push N numbers in the order of 1, 2, 3, ..., N and p ...

  7. 在vue移动端使用lib-flexible和px2remLoader适配屏幕

    在对移动端的适配过程中,之前一直用的rem来进行,通过自己封装一个rem的计算函数来对整个项目进行适配.现在发现了一种更为简单,也更加方便的方式来对移动端进行屏幕的适配. 下载lib-flexible ...

  8. 树形DP Choosing Capital for Treeland

    给你一棵有向树,需要选定一个点为capital,满足翻转边数最小 思路:先求出1为capital 的答案,然后向下更新孩子节点 dp[i]=dp[i-1]+judge(i); #include< ...

  9. Mongodb的mapreduce

    简单的看了一下mapreduce,我尝试不看详细的api去做一个group效果,结果遇到了很多问题,罗列在这里,如果别人也遇到了类似的bug,可以检索到结果. //先看person表的数据 > ...

  10. 洛谷P3402 可持久化并查集

    n个集合 m个操作 操作: 1 a b 合并a,b所在集合 2 k 回到第k次操作之后的状态(查询算作操作) 3 a b 询问a,b是否属于同一集合,是则输出1否则输出0 说是可持久化并查集,实际上是 ...