扩展 $.mobile.changePage 以接受更多选项?

Posted

技术标签:

【中文标题】扩展 $.mobile.changePage 以接受更多选项?【英文标题】:Extend $.mobile.changePage to accept more options? 【发布时间】:2012-08-11 18:52:48 【问题描述】:

我想扩展 $.mobile.changePage 以接受更多选项,例如添加页面完成加载时的回调函数以及 AJAX 调用(如 contentType)的更多选项。有没有办法在不更改源代码的情况下做到这一点?如果没有,我愿意为教育目的更改源代码,但在 jQuery Mobile GitHub 中找不到它:https://github.com/jquery/jquery-mobile。感谢您提供任何帮助或指导。

【问题讨论】:

只需为伪页面设置一个委托pageshow 或类似的事件处理程序,这是已经存在的功能。 【参考方案1】:

javascript 最令人兴奋的部分之一是能够使用通常称为Monkey Patching 的技术重新定义任何函数。 (顺便说一句,ES5 提供了一个新的freeze 方法,允许开发人员防止此类修改。)

这是一个 JavaScript MonkeyPatch 示例,它允许我们修改函数的行为而无需编辑它的源代码:

// A namespace object.
var Example = ;

// Sums two values.
Example.sum = function (a, b) 
    return a + b;


// Usage:
var result = Example.sum(1, 2);

假设我们想在 sum 方法中添加日志记录,我们可以在函数中添加 console.log 行,但我们也可以对其进行修补:

// Store a reference to the current 'Example.sum' function.
var originalSum = Example.sum;

// Now redeclare Example.sum...
Example.sum = function (a, b)  

    // Call the originalSum function first...
    var result = originalSum(a, b);

    // Now add some logging...
    console.log("Example.sum(" + a + ", " + b + ") yields " + result);

    return result;
;

现在当Example.sum被调用时,我们不仅会像以前一样得到结果,而且还会写入一个控制台消息。考虑到这一点,您可以用同样的方式修改 $.mobile.changePage 方法:

var originalChangePage = $.mobile.changePage;

// Redefine `changePage` so it accepts a 'complete' function in the options
// object which will be invoked when the page change is complete.
$.mobile.changePage = function (to, options) 
    if (typeof options.complete === "function") 
        $(body).one("pagechange", function (event)  
            options.complete(event);
        );
    

    originalChangePage(to, options);
;

【讨论】:

以上是关于扩展 $.mobile.changePage 以接受更多选项?的主要内容,如果未能解决你的问题,请参考以下文章

$.mobile.changePage 中的错误加载页面

Jquery Mobile - $ .mobile.changepage没有加载外部.JS文件

jQuery Mobile中jQuery.mobile.changePage方法使用详解

Jquery - $.mobile.changePage 不工作

在带有数据的 $.mobile.changePage 和两个 .php 页面之间,onload 不起作用

jQuery Mobile:获取通过 changePage 传递给页面的数据