如何使jQuery Mobile的在从骨干视图动态客户方模板？ [英] How to render jQuery Mobile in dynamic clientside templates from a Backbone view?

问题描述

我使用的是建立一个移动网站早午餐。

I'm building a mobile website using Brunch.

有关用户界面，我想用 jQuery Mobile的。

For the user interface, I want to use jQuery Mobile.

我开始改写现有home_view（Backbone.View）这样：

I started out adapting the existing home_view (Backbone.View) as such:

class exports.HomeView extends Backbone.View
  id: 'home-view'

  render: ->
    console.log "render() homepage"

    $(@el).html require('./templates/home')

    $.mobile.changePage('#homepage', 'slide', false, false)
    console.log $(@el)

    @

这是不行的，我怀疑这是因为骨干内喷射jQuery Mobile的前或后的HTML被初始化的东西？

This doesn't work, and I suspect it's because Backbone 'injects' the html before or after jQuery Mobile is initialized or something?

我可以使用Firebug Chrome的检查元素检查标记，但div元素被设置为显示：无; （如此反复，这似乎指向jQuery Mobile的不进行初始化或者类似的东西）

I can inspect the markup using Firebug and Chrome's Inspect Element, but the div elements are set to display:none; (so again this seems to point to jQuery Mobile not initializing or something like that)

的 ./模板/家居的是一个简单的生态的模板，一些基本的jQuery Mobile的标记，它看起来像这样：（与被注入体内标记）

./templates/home is a simple 'eco' template with some basic jQuery Mobile markup, and it looks like this: (and gets injected into the body tag)

<div data-role="page" id="homepage">
    <div data-role="navbar">
        <ul>
            <li><a href="/" class="ui-btn-active">Home</a></li>
        <li><a href="#helppage">Help</a></li>
    </ul>
    </div><!-- /navbar -->

    <div data-role="content">
        <div id="home">
            <h1>Home</h1>
        </div>
    </div>
</div>

我已搜索周围的SA和谷歌的解决方案，但并没有设法把它关闭。任何提示将是非常美联社preciated。谢谢！

I've searched around SA and Google for solutions but didn't manage to pull it off. Any tips would be highly appreciated. Thanks!

推荐答案

作为对<一个评论说某处href=\"http://stackoverflow.com/questions/8743931/jquery-mobile-does-not-render-list-after-jquery-template-was-inserted\">this问题，则可以使你的页面之后：

As stated somewhere in a comment on this question, you can do this after rendering your page:

$("#pageId").trigger("create");

这将迫使jQuery Mobile的更新您的网页，并解决您的问题。

This will force jQuery Mobile to update your page and fix your problem.

这篇关于如何使jQuery Mobile的在从骨干视图动态客户方模板？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！