Question

我有一个页面，其中包含嵌入在iFrame中的Google静态地图实例。页面加载时，此iFrame的初始实例会加载设置位置。用户可以点击页面上的地址列表，并根据他们的选择，通过AJAX重新加载带有嵌入式Google地图的iFrame。

我在加载新网址时遇到了一些麻烦。以下是我目前正在使用的PHP

$database->mysqlquery("SELECT street_address
                       FROM favorites
                       WHERE id = $row_id");

while($row = mysql_fetch_array($database->results)){
    $address = $row[street_address];
}

$url = "http://maps.googleapis.com/maps/api/staticmap?center=$address&zoom
=18&size=640x640&sensor=false";

我从数据库中获取地址并将其分配给变量。然后我将变量传递给静态地图URL。

定义了网址后，我调用了iFrame

<iframe width = "425" height = "315" frameborder = "0" scrolling = "no" 
marginheight = "0" marginwidth = "0" src= "<?php echo $url; ?>" id = "iframe"></iframe>

当我直接点击php页面或通过AJAX调用页面时，iFrame不会加载。当我使用Chrome或Firefox检查页面时，我会看到以下来源

<iframe width="425" height="315" frameborder="0" scrolling="no" 
marginheight="0" `marginwidth="0" 
src="http://maps.googleapis.com/maps/api/staticmap?center=116 Ponce De Leon Ave 
NE, Atlanta, GA&amp;zoom=18&amp;size=640x640&amp;sensor=false" id="iframe"></iframe>

如果我从上面获取src字符串并直接通过浏览器加载链接，则加载地图。

为什么我的iFrame没有加载？

更新

添加rawurlencode（）以编码$ address变量

后的新iFrame HTML

<iframe width="425" height="315" frameborder="0" scrolling="no" marginheight="0" 
marginwidth="0" 
src="http://maps.googleapis.com/maps/api/staticmap? 
center=116%20Ponce%20De%20Leon%20Ave%20NE%2C%20Atlanta%2C%20GA&amp;
zoom=18&amp;size=640x640&amp;sensor=false" id="iframe"></iframe>

Answer 1

您必须对street_address进行编码，例如通过rawurlencode()

URL中不允许使用空格（当您在浏览器中直接使用带空格的URL时，它会起作用，因为大多数浏览器会自动对URL进行编码）

使用带有谷歌静态地图的AJAX时URL中的空白区域

1 个答案: