使用加载 jquery mobile 失去风格

Question

我有一个这样格式的页面：

<div id="index" data-role="page">
     <div id="container"></div>
</div>

然后我将页面内容加载到#container 中，如下所示：

<script type="text/javascript">
 $(document).ready(function(){
    $('#container').load("pages/content.html");
 }); 
</script>

而“pages/content.html”有这样的内容：

<div data-role="content">

    <a href="pages/calendar.html" data-role="button">Calendar</a>
</div>

问题是按钮没有自带jquery mobile的风格..我试过了。触发器（'create'）但没有成功。

有什么建议吗？谢谢！

Answer 1

这样的事情应该可以工作：

$(document).ready(function(){
    $('#container').html('<div data-role="content"><a href="pages/calendar.html" data-role="button">Calendar</a></div>');
    $('#container').trigger('create');
 }); ​

将.html 替换为您的.load 代码。请参阅jsFiddle：如果您注释掉$('#container').trigger('create');，链接将保持未格式化。