`

jquery 调用live()方法无效?

阅读更多

【前言】

     之前讲课的时候讲过jquery的live()方法,当时讲解的时候说的是→当前或者未来的元素,但是后来发现jQuery的live方法无效???

    尝试着把jQuery代码库版本换到1.8及1.8之前才有效果,所以这里总结下

 

【主体】

     (1)用live方法时,注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了。

在jQuery官方网站上说明了原因,并声称用on方法取代live方法。
jQuery官方网站声称下面三行代码是等价的
$("a.offsite").live("click", function(){...}); // jQuery 1.3+
$(document).delegate("a.offsite", "click", function(){...}); // jQuery 1.4.3+
$(document).on("click", "a.offsite", function(){...}); // jQuery 1.7+

      (2)原因解析:

               在新版的jquery(>1.9版本即为新版)中,live()方法已经被删除了,所以我们在调用的时候会提示该函数不存在,js报错。 用live的时候要注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了。

       (3)原来的写法是on绑定元素点击事件: 

             如果直接替换为on()方法,那么新生成的元素再次点击事件的时候不会有任何效果,新的语法是: 

$(document).on("click","table a",function(){...})
或者(注意:该版本必须大于1.7)
$(body).on("click","table a",function(){...})
或者
$("table).on("click","a",function(){...})

            这里涉及到一个问题,$("body")这里为什么是body,其实我们可以选择其他的距离#company_logo更近的节点,这样会有更好的性能,其实on()是在body中找#company_logo节点,所以我们吧body换成#company_logo的上级节点会取得更好的性能。

           具体可以参考文章浅谈jQuery出现的新添加元素点击事件无效

 

 

 

.

分享到:
评论

相关推荐

    关于jquery中动态增加select,事件无效的快速解决方法

    为了解决这个问题,jQuery提供了`live`方法,它允许我们为当前及未来存在的元素绑定事件。`live`方法的核心在于事件委托,即将事件绑定到共享的祖先元素,通常是`document`或更具体的静态父元素,然后利用事件冒泡...

    解决jQuery使用append添加的元素事件无效的问题

    `on`方法自jQuery 1.7版本起成为绑定事件处理程序的主要方式,它取代了`bind`、`live`和`delegate`等方法。`on`的一个关键特性是它能够处理当前存在以及未来可能被添加到DOM中的元素的事件。 基本的`on`方法语法...

    jQuery详细教程

    jQuery 事件处理方法是 jQuery 中的核心函数。 事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。术语由事件“触发”(或“激发”)经常会被使用。 通常会把 jQuery 代码放到 部分的事件处理方法中: 实例 ...

    jquery使用on绑定a标签无效 只能用live解决

    需要注意的是,`live()`方法在jQuery 1.7版本之后已经被废弃,因为它性能较低且存在一些问题。现在推荐使用`on()`来实现事件委托,因为`on()`方法更强大、更灵活,并且性能更好。 总结一下,解决jQuery中动态元素...

    jquery1.7中文手册

    6. **链式操作(Chaining)**:jQuery的返回对象通常是jQuery实例,这意味着可以连续调用多个方法,如`$("#element").css("color", "red").slideUp();`。 7. **插件(Plugins)**:jQuery的生态系统中包含了大量...

    Jquery绑定事件(bind和live的区别介绍)

    标题提到的`bind`和`live`都是jQuery中用于事件绑定的方法,它们虽然在功能上有相似之处,但在使用场景和性能上有所不同。以下是对这两个方法的详细解释和比较: 1. `bind()`方法: `bind()`是jQuery中最基础的...

    Jquery对新插入的节点 绑定Click事件失效的解决方法

    在jQuery中,有几种方法可以解决这个问题,主要涉及`live`、`delegate`和`on`这三个函数。 1. **`live`方法**: 在旧版本的jQuery中,`live`方法是解决动态添加元素事件绑定的理想选择,因为它能够监听到当前及...

    Radio 单选JS动态添加的选项onchange事件无效的解决方法

    值得注意的是,自jQuery 1.7版本开始,`.on()`方法替代了`.live()`, `.delegate()`, 和 `.bind()`,成为推荐的事件绑定方式。因此,如果你正在使用较新的jQuery版本,可以使用`.on()`来实现相同的功能: ```...

    live-search:使用自动完成功能在 Live 中搜索词

    1. **监听输入事件**:使用JavaScript的`addEventListener`方法绑定到输入框的`input`或`keyup`事件,以便在用户键入每个字符时触发处理函数。 2. **查询处理**:每当接收到新的输入,就执行查询逻辑。这可能包括...

Global site tag (gtag.js) - Google Analytics