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

jQuery mobile css styles not being applied in underscore template

本文关键字：下划线 应用于 移动 css 样式 jQuery      更新时间：2023-09-26

我正在尝试对下划线模板内的元素使用jQueryMobile样式。看起来应该应用样式，因为它显示在计算样式中，但它没有被应用。另一方面，我自己的CSS定义确实得到了应用。有人能告诉我我在这里做错了什么吗？

Undercore模板：

<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/

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

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

将确保按钮的样式正确。

和往常一样，下面是正在工作的jsFiddle

相关文章：