0

我正在使用 jQuery Mobile + Backbone + RequireJS。成功登录后，我执行以下操作：

require(['app/view/main'], function(MainView) {
  var mainView = new MainView();
  $('body').html(mainView.render().el);
});

和 render() 看起来像

render: function() {
  this.$el.html(this.template);
  return this;
}

这样做后，我的页面是空白的。检查正文，我确实在正文中看到了以下 HTML：

<div data-role="page" id="main">
  <div data-role="header" data-position="inline">
      <h1>Accounts</h1>
  </div>
  <div data-role="content">
    hello
  </div>
</div>

我也试过在 render() 中这样做：

this.$el.html(this.template).trigger('create');

也

this.$el.html(this.template).page();

但页面仍然是空白的。任何想法为什么？

如果我只是将 HTML 放在正文中并加载页面，它会显示得很好，就像普通的 jQuery Mobile 应用程序一样。

4

1 回答 1

1

您是否要等到 pageinit 之后触发/创建您的页面？

$(document).bind('pageinit', function() {
    // trigger
});

此外，jQM 可能会将您的标记解释为单页模板，然后通过注入一个data-role='page'元素，您正在标记一个多页文档（只有一个页面）。尝试将<div data-role='page'>元素保留在默认标记中，然后动态添加页眉、内容和页脚。jQM 然后应该正确解释标记并相应地增强它。

于 2013-04-04T18:09:06.150 回答