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 回答