11

我似乎无法理解 jQuery Mobile 中以下内容之间的差异:

$( document ).live('pageshow', function(event) {
});

$( document ).bind('pageshow', function(event) {
});

$( document ).delegate("#page", "pageshow", function() {
});

如何在我的文档头部执行某些页面中不同的脚本?我使用哪些方法来调用这些脚本?

更新:jQuery 版本:1.7.1 jQuery Mobile 版本:1.1.0

4

3 回答 3

15

您将绑定到 jQuery Mobile 公开的“页面事件”,例如pageinit

$(document).delegate('#my-page', 'pageinit', function () {
    //this is like document.ready for this pseudo-page
});

由于您使用的是 jQuery Core 1.7.1,因此您可以使用.on()其语法略有不同:

$(document).on('pageinit', '#my-page', function () {
    //this is like document.ready for this pseudo-page
});

您的所有三种方法都做类似的事情。.live()与使用.delegate()withdocument作为根选择相同,但它已被贬值,因此停止使用它是个好主意(来源:http ://api.jquery.com/on )。.bind()直接在元素上使用document与使用相同,.delegate()但是当您使用时,.bind()您必须确定哪个伪页面在事件处理程序中而不是在函数调用中触发了事件。

例如:

$(document).bind('pageshow', function () {
    var id = $.mobile.activePage[0].id;
    //you can use $.mobile.activePage to do work on the current page
});

通常,当我们不知道元素何时会存在于 DOM 中时,会使用事件委托。它依赖于冒泡 DOM 的事件,直到它们到达根选择(在您的情况下,它始终是document元素)。

文档.delegate()http ://api.jquery.com/delegate

有关这些功能之间差异的更多一般信息,请参阅本文(我已阅读它以检查其准确性并且正确):http ://www.elijahmanor.com/2012/02/differences-between- jquery-bind-vs-live.html

于 2012-05-09T16:23:53.283 回答
0

这是一个很好的描述:http: //jquerybyexample.blogspot.com/2010/08/bind-vs-live-vs-delegate-function.html

但简短的回答是,如果您使用的是 jquery 1.7,您可能应该开始使用新的 API on() 而不是以下任何一种: http: //api.jquery.com/on/

于 2012-05-09T16:23:44.003 回答
0

前几天我也有同样的问题,发现这篇文章对每个问题都有明确的细分。

http://jquerybyexample.blogspot.com/2010/08/bind-vs-live-vs-delegate-function.html

于 2012-05-09T16:25:34.553 回答