Question

我在使用Handlebars模板在列表视图上显示JQuery Mobile图标按钮时出现问题：按钮＆＃39;图标不会显示。

一切正常，否则，模板生成列表，但按钮＆＃39;图标未显示。单击时按钮可以正常工作，如果我在标签之间添加一些字符，它会正确显示并在点击时起作用。

如果我只是将模板的内容复制/粘贴到HTML文档中，则图标显示正常。它仅在由模板生成时才显示。

我使用的是jquery mobile 1.4.2和Handlebars 2.0。

编辑：JSFiddle http://jsfiddle.net/6x9s9ys4/

这是HTML：

<div data-role="content">               
    <ul id="audioList" data-role="listview" data-inset="true" >             
        <!-- audioList-template -->                     
    </ul>               
</div>

这是模板：

<script id="audioList-template" type="text/x-handlebars-template">
    {{#.}}
    <li class="ui-grid-a" data-id="{{this.id}}">
        <div class="ui-block-a">
            <p>{{this.name}}</p>
        </div>
        <div class="ui-block-b">
            <a href="#" id="btnAddFavorite" data-icon="star" data-role="button" data-inline="true" data-iconpos="notext" ></a>
            <a href="#" id="btnAddToCart" data-icon="plus" data-role="button" data-inline="true" data-iconpos="notext" ></a>
            <a href="#" data-icon="audio" data-role="button" data-inline="true" data-iconpos="notext"></a>                          
        </div>
    </li>
    {{/.}}
</script>

这是JS：

$('#audioList').empty();
var audioListHandler = Handlebars.compile($("#audioList-template").html());
$('#audioList').html(audioListHandler(audioList));         
$('#audioList').listview().listview('refresh');

提前致谢。

Handlebars.js打破了JQuery Mobile的格式？

0 个答案: