跳至正文
-
哈哈酷
哈哈酷
  • 首页
  • 示例页面
  • 首页
  • 示例页面
关

搜索

联系
哈哈酷
哈哈酷
  • 首页
  • 示例页面
  • 首页
  • 示例页面
关

搜索

联系
IT

jQuery中的绑定函数

作者 hahacool
2018年3月8日 1 分钟阅读
0

jQuery中的绑定函数

(1).bind()为每个匹配元素的特定事件绑定事件处理函数


$("#niu").bind('click',function(){
alert("hello niuniu");
});

此代码把id为niu的元素响应事件click,并显示警报。使用bind绑定多个事件时,可以这样
[code]
$(“#niu”).bind(‘mouseenter mouseleava’,function(){
$(this).css(“background”,”yellow”);
});
$(“#foo”).bind({
click:function(){
},
mouseenter:function(){
}
});
[/code]
(2).delegate()指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数
[code]
$(“table”).delegate(“td”,”click”,function(){
$(this).toggleClass(“chosen”);
});
[/code]
(3).on在选择元素上绑定一个或多个事件的事件处理函数
[code]
function greet(event) { alert(“Hello”+event.data.name); }
$(“button”).on(“click”, { name: “Karl” }, greet);
$(“button”).on(“click”, { name: “Addy” }, greet);
[/code]
(4).live给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的
[code]
$(“a”).live(“click”, function() { return false; })
[/code]
on()则是最新的1.9版本整合了之前的三种方式的新事件绑定机制。.bind(), .live(), .delegate()都是通过.on()来实现的,.unbind(), .die(), .undelegate(),也是一样的都是通过.off()来实现的。

以上是常用的绑定函数。

技术文档引用:

自从.live()方法处理事件一旦传播到文档的顶部,live事件是不可能停止传播的。同样地,.delegate() 事件将始终传播给其中包含的被委托元素;同时,任何在 DOM 树中,比这些元素低的元素上绑定的相同事件,在 .delegate() 事件被调用的时候,也会被触发。因此,如果要在事件中阻止委托事件被触发,可以调用event.stopPropagation()或者返回false防止委派处理程序冒泡。
简单来说,.bind()是直接绑定在元素上,而.live()和.delegate()则是通过冒泡的方式来绑定到元素上的。.bind()方法只能给当前存在的元素绑定事件,对于事后采用JS方式新生成的元素无效,而live方法可以对后生成的元素也可以绑定相应的事件。

总之以后都用on吧

参考:
https://www.jianshu.com/p/fafe77736ef7
https://www.cnblogs.com/chenlogin/p/5105710.html

标签:

jQuery
作者

hahacool

关注我
其他文章
上一个

四摄法

下一个

二足尊以及福慧双修

近期文章

  • 川建国同志二三事
  • 四依法
  • 烦恼以及布施去除之
  • “每天被自己帅到睡不着”用古文怎么说?
  • Vagrant安装CentOS等
  • IT
  • 佛学
  • 其他
  • 笑话
  • 经济

JS mysql PHP sublime text vagrant 一真法界 事件 传说 伤不起 佛 六道 凡人 刹那 十法界 原型链 古文 史上 咆哮体 善 圣人 声闻 女人 完整 度 往生 慈悲 技巧 指南 搞笑 文科 果报 楼主 泡妞 淘宝 烦恼 爆笑 版本 理科 男人 禅定 般若 葱 西游记 训练 雷

沪ICP备16050445号-1

Copyright 2026 — 哈哈酷. All rights reserved. Blogsy WordPress Theme