jquery mobile中通过append添加listview失去格式

Question

var list="<div><ul data-role='listview' >" +
                    "<li><a href='#'>总 计</a></li> " +
                    "<li><a href='#'>已检查</a></li>" +
                    "<li><a href='#'>未检查</a></li>" +
                    " </ul></div>" 
                $('#con').append( list )

con是

的id
代码放到外面可以正常显示，但是通过append就无法正常显示，显示的样子就和没有导入jquery包的效果差不多，不知道要怎么办了。不知道大家有没有什么办法呢？

Answer 1

所有内容均由人工智能模型输出，其内容的准确性和完整性无法保证，不代表我的态度或观点。
（通义千问专栏，v2.1.0版本）

---

该回答引用通义千问大模型，仅提供参考，不保证完全正确
在 jQuery Mobile 中，当动态添加内容到页面时，需要使用相应的 "增强" 方法来重新初始化组件，使其呈现出正确的样式和行为。对于 listview，你需要调用 .listview() 或 .listview("refresh") 方法。

---

首先，确保你的 HTML 结构是正确的。你创建的 list 变量应该是一个包含一个带有 data-role="listview" 属性的 <ul> 元素的字符串。然后，在将这个列表添加到页面之后，你可以使用以下代码来刷新 listview：

var list = "<div><ul data-role='listview' >" +
                    "<li><a href='#'>总 计</a></li> " +
                    "<li><a href='#'>已检查</a></li>" +
                    "<li><a href='#'>未检查</a></li>" +
                    "</ul></div>";

$('#con').append(list).enhanceWithin(); // 使用 .enhanceWithin() 方法

// 或者使用 .listview() 方法（在 1.4.0 版本后弃用）
// $('#con ul').listview();

// 或者使用 .listview("refresh") 方法（推荐使用）
// $('#con ul').listview("refresh");

在这个例子中，我使用了 .enhanceWithin() 方法，它会查找所有子元素并增强它们。如果你确定你的 #con 元素只包含一个要增强的列表视图，那么你也可以直接对这个列表视图调用 .listview("refresh") 方法。

---

这样就可以正确地显示 jQuery Mobile 的列表视图样式了。记得检查你的代码是否按照这些步骤执行，并且确保 jQuery Mobile 和 jQuery 库都已经正确加载。