[英]After parsing from xml display data randomly using j query and html5
您好,我是HTML5和j查詢的新手。 我必須解析成功完成的XML數據。 現在解析數據后,我想使用j查詢隨機顯示它。請建議我該怎么做。
該代碼段是
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","xml/multiquestions1.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
var x=xmlDoc.getElementsByTagName("question");
$(document).ready(function (){
for(var j=0;j<x.length;j++)
{
if(j==0)
{
$("#navigationlist").append('<li><a href="#" id="selected_link" class="navg" onClick="display_nav('+j+',this);">'+(j+1)+'</a></li>');
display_nav(j,$("#selected_link"))
}
else
$("#navigationlist").append('<li><a href="#" class="navg" onClick="display_nav('+j+',this);">'+(j+1)+'</a></li>');
}
});
function display()
{
// for fetch question
Description=(x[i].getElementsByTagName("questionTxt")[0].childNodes[0].nodeValue);
Answer =(x[j].getElementsByTagName("image")[0].childNodes[0].nodeValue);
document.getElementById('options').style.backgroundImage = 'url('+Answer+')';
// Assign the value
document.getElementById("question").innerHTML= Description;
}
function display_nav(j,obj)
{
i=j;
$("#feedback").html("");
$(".navg").each(function(){
$(this).removeAttr("id");
});
$(obj).attr("id","selected_link");
Description=(x[j].getElementsByTagName("questionTxt")[0].childNodes[0].nodeValue);
Answer =(x[j].getElementsByTagName("image")[0].childNodes[0].nodeValue);
answermin=(x[j].getElementsByTagName("answermin")[0].childNodes[0].nodeValue);
answermax=(x[j].getElementsByTagName("answermax")[0].childNodes[0].nodeValue);
$("#bob").attr("min",answermin);
$("#bob").attr("max",answermax);
$("#bob").attr("value",0);
$("#out").html(0);
$("#out").css({left:0});
// Assign the value
document.getElementById("question").innerHTML= Description;
//document.getElementById("options").style.backgroundImage = url(Answer);
document.getElementById('options').style.backgroundImage = 'url('+Answer+')';
}
and xml is
<?xml version="1.0" encoding="utf-8"?>
<FlashCards>
<question id="1">
<questionTxt type="text"><![CDATA[Hello!]]></questionTxt>
<image visible="true"><![CDATA[img/smiley1.png]]></image>
</question>
<question id="2">
<questionTxt type="text"><![CDATA[Hi]]></questionTxt>
<image visible="true"><![CDATA[img/smiley2.png]]></image>
</question>
</FlashCards>
jQuery帶有自己的解析函數jQuery.parseXML()
-> parseXML
然后,您可以更輕松地在已解析的xml上進行搜索。
var xml = $.parseXML(xmlString),
// find and count all questions
questionCount = xml.find('question').length();
// find a random question out of the pool
xml.find('question#'+ Math.floor(Math.random() * (questionCount + 1))):
我沒有測試,但希望您能理解。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.