jQuery动态列表样式
jQuery动态列表样式
提问于 2013-01-22 15:50:02
我编写了以下代码
$(xml).find('list').each(function() {
$("#content_groups ul").append("<li><a href='#membergroup' onclick='functionare(\"" + $(this).attr("name") + "\")'>" + $(this).attr('name') + "</a><input type='checkbox' name='checkbox-0' id='checkbox-mini-0' class='custom' data-mini='true' /></li>");
});
$("#content_groups ul").listview('refresh');结果并不像我所希望的那样，即checkbox根本没有jquery css样式。你能告诉我有什么问题吗？
这就是结果的样子：
基本上，我对jquery/javascript是个新手，我的项目只需要用它来显示xml的一些结果。
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-01-22 16:19:35
首先要考虑的几件事。
$("#content_groups ul").listview('refresh');只会设置列表视图的样式，其他什么都不会。
要设置check box的样式，您需要使用如下所示的适当函数：
$("#checkbox-mini-0").checkboxradio('refresh');不幸的是，这对你没有任何帮助，因为jQuery移动版不能设置普通复选框元素的样式。如果使用标准复选框，则最终结果将是普通复选框。
jQuery移动复选框如下所示：
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>Agree to the terms:</legend>
<input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
<label for="checkbox-1">I agree</label>
</fieldset>
</div>您可以使用此代码并将其插入到您的列表视图li元素中(当然，您仍然需要使用.checkboxradio('refresh');)设置样式，但这仍然不会对您有所帮助，因为jQuery移动版复选框永远不会在列表视图中使用。
但是您可以在列表视图中创建自定义复选框，下面是我的示例，您可以这样做：https://stackoverflow.com/a/13634738/1848600
Stack Overflow用户
发布于 2013-01-22 16:06:25
虽然我手头上没有足够的信息来解决这个问题，但我想解释一下，当前的方法没有以一种干净的方式实现DOM。
最好将所有新的html添加到一个var中，然后在最后附加新创建的html。
var content_groups;
$(xml).find('list').each(function() {
content_groups += "<li><a href='#membergroup' onclick='functionare(\"" + $(this).attr("name") + "\")'>" + $(this).attr('name') + "</a><input type='checkbox' name='checkbox-0' id='checkbox-mini-0' class='custom' data-mini='true' /></li>";
});
$("#content_groups ul").append(content_groups);
$("#content_groups ul").listview('refresh');我知道这不能真正解决你的问题，但它应该会减少你的网站在Internet Explorer中冻结的时间。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14462518
复制
相似问题
JQuery移动样式动态列表视图
如何使用jQuery动态更新样式列表？
jQuery动态添加css样式到链接列表
动态样式列表视图
jQuery移动设备未设置动态列表视图的样式
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
