提问人:PhDJ 提问时间:3/28/2013 最后编辑:GajotresPhDJ 更新时间:7/3/2013 访问量:953
添加列表元素后将 css 应用于 listview
Apply css to listview after adding list elements
问:
在获得数据后,我正在使用 JSON 将元素添加到列表中,我执行以下操作:
success: function(data){
var list = $('#' + HTMLfieldName[index] + 'Ul');
$.each(data, function() {
newLi = document.createElement('li');
ref = document.createElement('a');
ref.innerHTML = this.description;
ref.href = '#' + this.code;
newLi.appendChild(ref);
list.append(newLi);
});
}
这工作正常,但列表中的元素显示为普通的 href(蓝色和下划线),而不是 listview 示例中使用的漂亮 CSS。
这是代码渲染后的样子:
<ul class="levelUl ui-listview ui-listview-inset ui-corner-all ui-shadow" data-role="listview" data-inset="true" name="famUl" id="famUl">
<li><a href="#2930">Finishing</a></li>
<li><a href="#2910">Speciality Printing</a></li>
<li><a href="#2900">Toner</a></li>
</ul>
如果我将该代码粘贴到 HTML 页面中,它看起来不错。
在将CSS添加到页面后,我需要执行某些操作来应用CSS吗?
答:
2赞
Gajotres
3/28/2013
#1
您必须使用以下命令对动态添加的列表视图元素触发标记增强:
$('ul#id').listview('refresh'):
实况示例:http://jsfiddle.net/Gajotres/LrAyE/
基本上,您的代码将如下所示:
success: function(data){
var list = $('#' + HTMLfieldName[index] + 'Ul');
$.each(data, function() {
newLi = document.createElement('li');
ref = document.createElement('a');
ref.innerHTML = this.description;
ref.href = '#' + this.code;
newLi.appendChild(ref);
list.append(newLi);
});
list.listview('refresh');
}
请记住,您必须在每个
循环之后调用 .listview('refresh');
评论