首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >jQuery -> bind / live / delegate 终结者 – on

jQuery -> bind / live / delegate 终结者 – on

作者头像
全栈程序员站长
发布2022-07-05 21:25:07
发布2022-07-05 21:25:07
4530
举报

大家好,又见面了,我是全栈君

最近的一项研究jQuery。利用获得的最新版本1.11.1

据该书打下面的代码示例,,反正也发现跑不起来。

html

代码语言:javascript
复制
<div class="container">
	<div class="box">hello world</div>
</div>

js

代码语言:javascript
复制
$(document).ready(function() {
	$('.box').live('click', function() {
		$(this).clone().appendTo('.container');
	});
});

原来live已经废弃掉了,取而代之的是on,jQuery并打算用on来代替bind,live,delegate

參考API文档,on的使用方法例如以下

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

为元素绑定事件

代码语言:javascript
复制
$( "#dataTable tbody tr" ).on( "click", function() {
  alert( $( this ).text() );
});

等价于

代码语言:javascript
复制
$( "#dataTable tbody" ).on( "click", "tr", function() {
  alert( $( this ).text() );
});

为事件处理函数传递数据

代码语言:javascript
复制
function greet( event ) {
  alert( "Hello " + event.data.name );
}
$( "button" ).on( "click", {
  name: "Karl"
}, greet );
$( "button" ).on( "click", {
  name: "Addy"
}, greet );

具体使用方法可參考 官方样片

版权声明:本文博客原创文章。博客,未经同意,不得转载。

发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/117570.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022年1月3,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 为元素绑定事件
  • 为事件处理函数传递数据
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档