高级 jQuery：让好的应用程序变成强大的应用程序

核心提示： Live/DiejQuery 1.3 版本的另外两个强大的新特性是 live() 和 die() 函数，通过一个示例可以看到它对构建设计良好的 Web 应用程序的作用，高级 jQuery：让好的应用程序变成强大的应用程序(5)，想像一下对表中的每个单元格都添加一个双击，作为 jQuery 老手，

Live/Die

jQuery 1.3 版本的另外两个强大的新特性是 live() 和 die() 函数。通过一个示例可以看到它对构建设计良好的 Web 应用程序的作用。想像一下对表中的每个单元格都添加一个双击。作为 jQuery 老手，您应该知道要在 document.ready() 函数中设置双击，如清单 4 所示。

清单 4. 设置双击

$("tr.messageRow").dblclick(function()　{　
　　if　($(this).hasClass("mail_unread"))　
　　{　
　　　$(this).removeClass("mail_unread");　
　　}　
　　});

这个设计存在一个问题。它向包含一个 messageRow 类的表的每行添加一个双击事件。但是，如果向该表添加新的行，会发生什么事情呢？例如，当您使用 Ajax 在未重新加载页面的情况下将额外的消息加载到页面时，可能会显示这些行。这导致一个问题，因为所编写的代码不能工作。您创建的事件被绑定到所有在加载页面时显示的 tr.messageRow 元素中。它没有绑定到您在页面的生命周期中创建的任何新的 tr.messageRow 中。编写类似代码的程序员最终会很失望的，因为它无法工作。在 jQuery 文档发现该问题之前，jQuery 新手可能要花好几个小时才能弄明白为什么他们的代码不能工作（这也是我去年的经历）。

在 jQuery 1.3 之前，有 3 种可以解决该问题的方法，但都不是很好（对于使用 jQuery 1.2.x 的程序员而言，它们仍然有效）。第一种方法是重新初始化技术，它在每次添加新的元素之后重新将事件添加到选中的元素中。第二种方法利用了 bind/unbind，如前面小节所示。清单 5 显示了这两种方法。