jquery - 如何在旧视图上显示微调器而不是主干中的空白页面

Question

在我的应用程序中，我在转换期间得到一个中间空白页。并且 ajax 微调器显示在该页面中。

这就是我在 main.js 中包含微调器的方式

$(document).ajaxSend(function() {
    $.mobile.loading( 'show');
});
$(document).ajaxComplete(function() {
    $.mobile.loading( 'hide');
});

在路由器中，我通过 oldview.remove() 和 oldview.unbind() 删除旧视图并加载新视图以消除僵尸视图问题。

我的问题是如何在旧视图上方显示 ajax 微调器，而不是在空白页面上显示它。

任何帮助表示赞赏。

Answer 1

更新

对不起，我有点跑题了。我假设您已经有一个 jQuery 插件，以便在任何 DOM 元素之上显示/隐藏加载覆盖。

因此，要实施我的解决方案，您需要一个。

注意：据我所知，您不能将 应用于$.mobile.loading()特定的 DOM 元素。

例如，您可以使用jquery-loadmask 之类的东西，然后重新设置 CSS 样式以匹配$.mobile.loading它。

或者我个人使用 github 上的这个简单的 jQuery 函数来实现相同的行为（可能更轻）。

原来的

你有没有尝试过：

oldview.$el.loading('show');

也是ajaxSend一个全局 Ajax 事件，而且不与任何 DOM 元素关联，而只与document.body元素关联，除了在视图中处理之外，您别无选择show/hide：

var OldView = Backbone.View.extend({

    //...

    events: {
        "click .the-button-trigering-the-ajax-call": "onButtonClicked"
    },

    onButtonClicked: function (e) {
        this.$el.loading('show');
    },

    // And you could get rid of it when rendering
    render: function () {

        this.$el.loading('hide');

        //...

        return this;
    }
});

只有一种解决方案。