jsonp与jquery构建列表

我已经阅读了许多描述在这里，并从其他来源描述使用jQuery获取json和建立一个列表。所以，我有一个UL超简单的HTML页面就可以了：jsonp与jquery构建列表

<!DOCTYPE html> 
<html> 
    <link rel="stylesheet" href="css/normalize.css"> 
    <link rel="stylesheet" href="css/main.css"> 
    <script src="js/vendor/modernizr-2.6.2.js"></script>   
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> </script> 
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script> 
    <script src="js/main.js"></script> 
    <script> 
     $(document).ready(getElementsInGroup); 
    </script> 
</head> 
<body> 
<ul id="memberList"> 
</ul> 
</body> 
</html>

我有越来越成员main.js.两种方法第一次使用的getJSON：

function getElementsInGroup() { 
var url = 'http://108.250.12.12:8080/members?format=json&jsonp=?'; 
$.getJSON(url, null, function(data) { 
    var items = []; 
    $.each(data, function(index, element) { 
     items.push("<li>" + element.text + "</li>"); 
     }); 
    $('#memberList').append(items.join('')); 
    }); 
};

我可以看到萤火虫的呼叫发射和返回结果：

[{"text": "Bob Jones", "id": 1}, {"text": "Mary Smith", "id": 2}]

但是，列表不显示也不做任何的错误。所以，我想创建一个版本的功能是，我只是把那个硬编码reult在：

function getElementsInGroup2() { 
     var items = []; 
     var data = [{"text": "Bob Jones", "id": 1}, {"text": "Mary Smith", "id": 2}]; 
     $.each(data, function(index, element) { 
      items.push("<li>" + element.text + "</li>"); 
      }); 
     $('#memberList').append(items.join('')); 
};

并且这产生我期待的名单。有什么可以看到我做错了吗？

来源

2013-07-01 RockyMountainHigh

你在console.log（$（'＃memberList'））.getJSON中获得什么？ – raam86

我什么也没看到。 @ raam86 – RockyMountainHigh

ajax调用后有什么变化吗？什么都附加到dom？ – raam86

答案实际上是我使用的路线不支持jsonp。我修改了路线，现在一切都很好。谢谢@Felix。

来源

2013-07-05 15:56:31 RockyMountainHigh

您正在从JSON文章中获得结果，因此您需要使用for循环来绑定您的列表。对于（i = 0;= data.length; i ++） }

来源

2013-07-04 10:14:04 Hitesh

jsonp与jquery构建列表

回答

相关问题