考虑这个json对象:
[{"data":{"ID":"3","Category":"Career"}},{"data":{"ID":"5","Category":"Emotions"}},{"data":{"ID":"1","Category":"Finance"}},{"data":{"ID":"2","Category":"Health"}},{"data":{"ID":"6","Category":"Legacy"}},{"data":{"ID":"4","Category":"Relationships"}}]
并考虑此客户端代码:
$(function (){
$.ajax({
url: 'category.php',
data: "",
dataType: 'json',
success: function(data)
{
var output = '';
$.each( data, function( key, obj) {
$.each( obj, function( index, item) {
//console.log(index+ ": " + item);
url = "goal.php?catID=" + item.ID;
output = '<li><a>' + item.Category+ '</a></li>';
href = $('a').attr("href",url); $('a').append(href);
$('#listview').append(output).listview('refresh');
});
});
}
}); });
<div data-role="page" id="home">
<div data-role="header"><h1>My Goals</h1></div>
<div data-role="listview" data-autodividers="true" data-inset="true">
<ul data-role="listview" id="listview">
</ul>
</div>
我第一次尝试使用JQuery mobile,我试图遍历JSON并使用链接输出类别 -
我差不多成功了,但只是在网址上追加了最后一条记录item.ID?
有人可以帮忙吗?
由于
答案 0 :(得分:2)
当你这样做时
$('a').attr("href",url)
您正在更改网页的所有a
元素。当然,最后一次迭代胜出。
我建议你循环:
$('#listview').append(
$('<li/>').append($('</a>').attr('href', url).html(url))
).listview('refresh');
答案 1 :(得分:2)
尝试
$(function (){
$.ajax({
url: 'category.php',
data: "",
dataType: 'json',
success: function(data)
{
$.each( data, function( key, obj) {
var item = obj.data;
$('<li></li>').append($('<a></a>', {
text: item.Category,
href: 'goal.php?catID=' + item.ID
})).appendTo( $('#listview'))
});
$('#listview').listview('refresh');
}
});
});
演示:Fiddle