Question

我想在更改页面时取消绑定所有事件。我使用this solution使用this.unbind（）调用扩展了View的close函数，我尝试将它与来自here的路由器中的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();
});

Answer 1

我遇到了同样的问题。出现JQM错误是因为您尝试在this.remove()骨干扩展方法中调用close()，但事件＆＃34; Pagehide＆＃34;已经从DOM中删除了视图。

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

如果您对 close 方法发表评论this.remove()，则可行。

另一个选择是在 pagehide jqmobile事件上发表评论$(event.currentTarget).remove();，并且不会在 close 方法上发表评论this.remove()。

您无法同时执行这两项操作，您应该选择其中一种选项。我更喜欢第二种选择，但我认为它与第一种选择相似。我建议您不要在 pagehide 事件上致电unbind()。

Answer 2

我遇到了同样的问题，由于某种原因，没有触发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();
    });
});

我花了几个小时和this SO线程来实现这个目标。希望这有助于某人。

Backbone和JQuery Mobile：在页面转换后取消绑定事件

2 个答案: