2

jqueryモバイルページ内でHandlebarsjsを使用していますが、サーバーからデータが返されると、テンプレートに挿入されます...しかし、jqueryモバイルCSSスタイルはテンプレート内のコードに適用されません.

私のテンプレートは次のようになります。

            <script id="card_list_template" type="text/x-handlebars-template">
            {{#each this}}
            <li>
                <a href="#">
                    <img src="{{path}}" />
                    <h3>{{first_name}}&nbsp;{{last_name}}</h3>
                    <p>Card Owner:&nbsp;{{user_id}}</p>
                </a>
            </li>
            {{/each}}
        </script>

上記のコード ブロックは、この順序付けられていないリストに挿入されます。

<ul id="search_results" data-role="listview" data-theme="a">

data-role="listview" は特定のスタイルをリスト アイテムに適用することになっていますが、テンプレートから生成されたアイテムには機能しません。

4

2 に答える 2

9

要素を呼び出す.trigger('create')と、スタイルが適用されます。

例：

var template = Handlebars.compile(source);
var html = template(output);
$('#handlebarsData').html(html);
// Applies jQuery Mobile styles
$('#handlebarsData').trigger('create');
于 2012-11-12T20:52:35.867 に答える
0 
.trigger('create')

順序なしリストでは役に立ちませんでした。しかし

$('ul').listview('refresh');

やりました。

于 2013-03-28T10:13:00.183 に答える