Question

我正在使用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应用程序一样。

Answer 1

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

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

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

为什么我的动态添加内容无法使用jQuery Mobile呈现？

1 个答案: