-1

我正在尝试通过 Panoramio 在我的 Google 地图上显示一层缩略图。Panoramio 是 RESTful 的,其主页声明必须在 API url 上提交简单的 GET 请求。

我在 REST 方面没有太多经验,并且试图让 API 在处理应该由调用产生的 JSON 之前用文本响应。我对 AJAX 没有太多经验,可以指出我正确的方向吗?到目前为止,这是我的相关代码:

**HTML**
<div class="backdiv-pix"></div>

**JS**
var xmlhttp = new XMLHttpRequest();
var thumbUrl = "http://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=20&minx=-180&miny=-90&maxx=180&maxy=90&size=medium&mapfilter=true"
xmlhttp.open("GET", thumbUrl, true)
xmlhttp.send();
document.getElementById('backdiv-pix').innerHTML=xmlhttp.responseText;

我的浏览器抛出以下错误:

无法将属性“innerHTML”设置为 null

一些指导将不胜感激。

多发性硬化症

4

1 回答 1

0

您的代码中没有 div id="backdiv-pix"。要么改变:

<div class="backdiv-pix"></div>

至:

<div id="backdiv-pix"></div>

或使用document.getElmentByClassName('backdiv-pix')[0].innerHTML=xmlhttp.responseText

然而,一旦你修正了那个错字,你将需要处理这个问题:

XMLHttpRequest cannot load http://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=20&minx=-180&miny=-90&maxx=180&maxy=90&size=medium&mapfilter=true. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://fiddle.jshell.net' is therefore not allowed access.

工作小提琴

代码片段:

var xmlhttp = new XMLHttpRequest();
var thumbUrl = "http://www.panoramio.com/map/get_panoramas.php?set=public&from=0&to=20&minx=-180&miny=-90&maxx=180&maxy=90&size=medium&mapfilter=true&callback=?"
$.getJSON(thumbUrl, function(data) {
  document.getElementById('backdiv-pix').innerHTML = JSON.stringify(data);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="backdiv-pix"></div>

于 2015-08-24T21:04:39.447 回答