Question

我正在尝试在下划线模板中的元素上使用jQueryMobile样式。似乎样式应该应用，因为它显示在计算的样式中但它没有被应用。另一方面，我自己的CSS定义确实应用了。请问有谁能告诉我这里做错了什么？

下划线模板：

<script type="text/template" id="test-template">
    <!-- jQueryMobile Styling does not work here... -->
    <a href="#" id="button2" data-role="button" data-icon="arrow-r" data-iconpos="right">Button 2 (jquery style doesn't work)</a>
    <a href="#" id="button3" data-role="button" data-icon="arrow-r" data-iconpos="right">Button 2 (local css style works)</a>
</script>

JavaScript的：

$("#app-content").html(_.template($('#test-template').html()));

CSS：

#button3 {
    background-color: red;
}

请在这里查看我的jsfiddle： http://jsfiddle.net/DanielBank/WJzTn/

Answer 1

继承，jQuery Mobile不会将样式应用于动态注入的元素。您需要在元素上调用.trigger('create')来创建基于jQuery移动的元素。

$("#app-content").html(_.template($('#test-template').html())).trigger('create')

确保按钮获得正确的样式。

像往常一样，Here's the working jsFiddle

jQuery移动css样式未应用于下划线模板

1 个答案: