我正在尝试解析一些JSON并将元素“startTime”和“endTime”添加到列表中。我能够成功接收JSON,但是我无法正确解析然后循环以将每个实例添加到列表中。在UL的内部,我想为每个创建列表,如下面的演示:
$.ajax({
url: 'localhost:8080/sample?',
dataType: 'json',
success: function (data){
var json = $.parseJSON(data);
var $calAppts = $('#appts');
$('<li data-role="list-divider">' + this.startTime
+ ' - ' + this.endTime + '<span class="ui-li-count"></span></li>').appendTo($appts);
我试图在UL中插入LI的HTML:
<div data-role="main" class="ui-content" id="headerDate">
<ul data-role="listview" data-inset="true" id="appts">
</ul>
</div>
所以基本上对于我在JSON中返回的每个约会,我想添加一个带有startTime和endTime的新LI。
我正在使用JQM 1.3.2和JQUERY 1.8.0。
谢谢
答案 0 :(得分:0)
改变这个:
$.ajax({
url: 'localhost:8080/sample?',
dataType: 'json',
success: function (data){
var json = $.parseJSON(data);
var $calAppts = $('#appts');
$('<li data-role="list-divider">' + this.startTime
+ ' - ' + this.endTime + '<span class="ui-li-count"></span></li>').appendTo($appts);
进入这个:
$.ajax({
url: 'localhost:8080/sample?',
dataType: 'json',
success: function (data){
var json = $.parseJSON(data);
$.each( json, function( key, value ) {
var agrega = "<li data-role='list-divider'>";
if(key=='startTime')
{
agrega = agrega + value
}
if(key=='endTime')
{
agrega = agrega + ' - ' + value;
}
agrega = agrega + '<span class="ui-li-count"></span></li>';
$('#appts').append(agrega);
});
答案 1 :(得分:0)
从您的代码示例中,您的问题似乎是您尝试在错误的位置(startTime
)查找this
属性。在您的示例中,startTime
属性应该出现在您解析的JSON上,因此访问密钥应该可以解决问题:
$('<li data-role="list-divider">' + json.startTime
+ ' - ' + json.endTime + '<span class="ui-li-count"></span></li>').appendTo($appts);
如果返回的JSON是一系列次数,那么您还需要遍历JSON对象:
$.each(json, function(key, value) {
if (key === 'startTime') {
// append to the list
}
});
附加说明:
如果JSON是从AJAX调用返回的内容,那么您不需要在其上使用$.parseJSON
。 JSON对象是JavaScript对象,因此您可以简单地使用返回的值并访问它们(这意味着您可以直接使用data.startTime
而不是先解析它。)
答案 2 :(得分:0)
请在下面找到回复
var ulObject = $("#appts");
var ajaxObject = $.ajax({
type:"POST",
dataType:"json",
url:"" //Provide the URL in the field to be processed.
});
ajaxObject.done(function(msg){
var jsonResponse = $.parseJSON(msg);
var listObjectStart = '<li data-role="list-divider">'
var listObjectEnd = '</li>';
$.each(jsonResponse,function(key,value){
if(key === "startTime")
{
listObjectStart += value;
}
else if(key === "endTime")
{
listObjectStart += '-'+value+'<span class="ui-li-count"></span>';
}
});
listObjectStart += listObjectEnd;
ulObject.append(listObjectStart);
});
答案 3 :(得分:0)
如果服务器以json格式将数据发送回客户端,请尝试以下操作。
$.ajax({
url: 'localhost:8080/sample?',
dataType : 'json',
success: function(data){
$("#appts").append('<li data-role="list-divider">' + data.startTime
+ ' - ' + data.endTime + '<span class="ui-li-count"></span></li>');
},
error: function(){
alert('There was an error in communication.');
}
});