0

我想在更改页面时取消绑定所有事件。我采用了这个解决方案，它通过 this.unbind() 调用扩展了 View 的 close 函数，并尝试将它与路由器中的 changePage 函数中的 JQM 页面转换从这里结合起来：

changePage: function(page){
        $(page.el).attr("data-role", "page");
        page.render();
        $("body").append($(page.el));
        var transition = $.mobile.defaultPageTransition;
        if(this.firstPage){
            transition = "none",
            this.firstPage = false;
        }
        $.mobile.changePage($(page.el), {changeHash: false, transition: transition});
    }

然后 changePage 看起来像这样：

changePage: function(page){
        if (this.currentView)
            this.currentView.close();
        $(page.el).attr("data-role", "page");
        this.currentView = page;
        page.render();
        $("body").append($(page.el));
        var transition = $.mobile.defaultPageTransition;
        if(this.firstPage){
            transition = "none",
            this.firstPage = false;
        }
        $.mobile.changePage($(page.el), {changeHash: false, transition: transition});
    }

但后来我得到了 JQM 错误：

Uncaught TypeError: Cannot call method '_trigger' of undefined jquery.mobile-1.1.0.js:2788
transitionPages jquery.mobile-1.1.0.js:2788
$.mobile.changePage jquery.mobile-1.1.0.js:3390
window.AppRouter.Backbone.Router.extend.changePage

我还有 jqm-config.js，它在 pagehide 事件中删除页面的 DOM。我可以在这里取消绑定所有事件，例如：$(event.currentTarget).unbind();？但这也不起作用。

  $('div[data-role="page"]').live('pagehide', function (event, ui) {
    $(event.currentTarget).remove();
});
4

2 回答 2

1

我有同样的问题。this.remove()发生 JQM 错误是因为您尝试调用close()主干扩展方法，但事件“pagehide”已经从 DOM 中删除了视图。

Backbone.View.prototype.close = function () {
    if (this.beforeClose) {
        this.beforeClose();
    }
    this.remove();
    this.unbind();
};

如果您评论this.remove()close方法，它会起作用。

另一种选择是评论$(event.currentTarget).remove();pagehide jqmobile事件而不评论this.remove()close方法。

你不能两者都做，你应该选择两个选项之一。我更喜欢第二种选择，但我认为它类似于第一种选择。我不建议调用pagehideunbind()事件。

于 2013-01-03T16:17:37.467 回答
0

我遇到了同样的问题，由于某种原因，pagechange 事件没有被触发，并且之前的页面没有从 DOM 中删除。一旦我删除了非活动页面，CSS 就会恢复运行。

所以我加了

    $('div[data-role="page"]').bind('pagehide', function (event, ui) {
        $(event.currentTarget).remove();
    });

里面

     $(document).bind('pagechange', function() {

     });

所以我的 jqm-config.js 看起来像这样

$(document).bind("mobileinit", function () {
     console.log('mobileinit');
     $.mobile.ajaxEnabled = false;
     $.mobile.linkBindingEnabled = false;
     $.mobile.hashListeningEnabled = false;
     $.mobile.pushStateEnabled = false;
//$.mobile.defaultPageTransition = "none";
});

  $(document).bind('pagechange', function() {
    $('div[data-role="page"]').bind('pagehide', function (event, ui) {
        console.log("Removing page");
        $(event.currentTarget).remove();
    });
});

我花了几个小时和这个SO 线程来解决这个问题。希望这可以帮助某人。

于 2013-12-14T11:24:32.737 回答