Question

我对JQuery和Javascript都很陌生。我有一个存储在里面的产品的XML文件，我想在可折叠的div中显示这些产品作为可折叠的div。我有以下Javascript文件：

$(document).ready(function()
{
$.ajax({
type: "GET",
url: "producten.xml",
dataType: "xml",
success: parseXml
});
});

function parseXml(xml)
{
var container = document.getElementById("behuizingen");
$(xml).find("behuizing").each(function()
{
var release = document.createElement("div");
release.setAttribute('data-role', 'collapsible');
release.innerHTML = "<h3>" + $(this).find('naam').text() + "</h3>";
container.appendChild(release);
 });
}

这应该获取我的所有产品名称并将它们放在一个可折叠的div中，它确实如此，但它将名称显示为纯HTML文本而不是JQuery Mobile可折叠div。这些是我的HTML文件中的导入：

<link rel="stylesheet" href="jquery.mobile-1.2.0/jquery.mobile.structure-1.2.0.css" />

<link rel="stylesheet" href="jquery.mobile-1.2.0/jquery.mobile-1.2.0.css" />

<link rel="stylesheet" href="styles/style.css" />

<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>

<script src="jquery.mobile-1.2.0/jquery.mobile-1.2.0.min.js"></script>

<script src="styles/winkel.js"></script>

另外，它不显示产品，如果我从我的主页面开始并导航到显示产品的页面，我必须刷新（ctrl + f5）让它们显示。如果有人可以帮助我，我会非常感激，因为我不知道如何修复它。

Answer 1

在页面初始化后通过ajax追加jquery移动小部件时，你必须.trigger（“创建”）。即

$( ...new markup that contains widgets... ).appendTo( ".ui-page" ).trigger( "create" );

为了更好地理解学习this文档。

JQuery Mobile数据角色不适用于div

1 个答案: