jQuery Mobile CSS没有样式化JS插入HTML

时间:2013-07-15 21:04:08

标签: jquery css html5 jquery-mobile backbone.js

我正在使用Backbone.js和jQuery Mobile制作移动网络应用,但我遇到了一些样式问题。只是为了测试一下我想要设置我的Logout按钮。在造型之前,我有:

this.$el.append('<input type="button" id="logoutButton" value="Logout">');

在我的代码的某个点,一直工作正常。我将此行更改为:

this.$el.append('<a href="" data-role="button" data-theme="c" data-inline="true" id="logoutButton"> LOGOUT </a>');

但是,当我这样做时,它只显示“LOGOUT”作为没有应用CSS的普通链接。我尝试将相同的代码放在我的HTML文件的正文中,而不是使用JS插入它,并且它的样式正确。在将所有其他文件和我的JS代码包含在绑定到$(document).ready()的函数中之前,我将CSS文件加载到文档的头部,因此我不确定为什么CSS无法正常工作。

我错过了概念性的东西吗?我该如何解决这个问题?

1 个答案:

答案 0 :(得分:2)

我认为您需要使用buttonMarkup来刷新样式:

$("#one").append('<a href="" data-role="button" data-theme="c" data-inline="true" id="logoutButton"> LOGOUT </a>')
$("#logoutButton").buttonMarkup("refresh");

#one只是HTML中的随机页面。

演示:http://jsfiddle.net/hungerpain/tEnet/

And DONT USE ready event with jQM.