在页面的Jquery Mobile内容中,我有一个像这样的img src:
<img id="map" src="https://maps.googleapis.com/maps/api/staticmap?center=Madison, WI&zoom=14&size=288x200&markers=Madison, WI&sensor=false" height="200" width="288" />
我有一个按钮和代码,用于在javascript中更改上述IMG的SRC
<script type="text/javascript">
function update()
{
cval = '"https://maps.googleapis.com/maps/api/staticmap?center=Brisbane&zoom=14&size=288x200&markers=Brisbane&sensor=false"'
$('#map').attr('src',cval);
}
</script>
页面加载正常并显示地图图像。但是当我从一个按钮调用脚本时,我收到一个错误,图像显示不显示。查看Chrome Inspect Elements,第一个调用是GET并加载图像,但第二个调用也是GET但不起作用且错误是“禁止”
我正在尝试创建一个移动页面,以便当用户输入新位置并单击“刷新”时,我想将IMG更新到新位置,但这会给我一个错误。
那么这里有什么问题?为什么第一个GET工作但不是第二个以及如何使其工作?
同样只是在浏览器中粘贴网址也不起作用。
答案 0 :(得分:1)
我通过制作新的<img>
来解决这个问题,而不仅仅是切换src
属性。
http://jsfiddle.net/lollero/VKAW9/1
HTML:
<img id="map" src="https://maps.googleapis.com/maps/api/staticmap?center=Madison, WI&zoom=14&size=288x200&markers=Madison, WI&sensor=false" height="200" width="288" />
jQuery的:
$('html').on("click", function() {
var map = $('#map'),
cval = 'https://maps.googleapis.com/maps/api/staticmap?center=Brisbane&zoom=14&size=288x200&markers=Brisbane&sensor=false';
$('<img id="map" height="200" width="288" src="'+ cval +'">').insertAfter( map );
map.remove();
});