JS返回错误的输出PHP/XML文件

JS returning the wrong output PHP/XML file

本文关键字：XML 文件 PHP 输出 返回 错误 JS      更新时间：2023-09-26

我正在尝试构建一个简单的网络"应用程序"，其中我将有一个地图（使用谷歌地图api）和它下面的几个链接作为"过滤器"。我想按类型（如：酒吧或餐馆）过滤数据。

基本上，map.html页面使用javascript来获取由PHP脚本生成的XML。

这是以下代码：

map.hmtl:

<!doctype html>
<html>
<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyASO80RjNn2d_Jjy9vdNHA5E3tfmALkWXw&sensor=false"></script>
    <script type="text/javascript">
        //<![CDATA[
        var customIcons = {
            restaurant: {
                icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png',
                shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
            },
            bar: {
                icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
                shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
            }
        };
        function load() {
            var map = new google.maps.Map(document.getElementById("map"), {
                center: new google.maps.LatLng(47.6145, -122.3418),
                zoom: 13,
                mapTypeId: 'roadmap',
                disableDefaultUI: true
            });
            var infoWindow = new google.maps.InfoWindow;
            // Change this depending on the name of your PHP file
            downloadUrl("genxml3.php", function(data) {
                var xml = data.responseXML;
                var markers = xml.documentElement.getElementsByTagName("marker");
                for (var i = 0; i < markers.length; i++) {
                    var name = markers[i].getAttribute("name");
                    var address = markers[i].getAttribute("address");
                    var type = markers[i].getAttribute("type");
                    var point = new google.maps.LatLng(
                        parseFloat(markers[i].getAttribute("lat")),
                        parseFloat(markers[i].getAttribute("lng"))
                    );
                    var html = "<b>" + name + "</b> <br />" + address + "<br />" + type;
                    var icon = customIcons[type] || {};
                    var marker = new google.maps.Marker({
                        map: map,
                        position: point,
                        icon: icon.icon,
                        shadow: icon.shadow
                    });
                    bindInfoWindow(marker, map, infoWindow, html);
                }
            });
        }

        function bindInfoWindow(marker, map, infoWindow, html){
            google.maps.event.addListener(marker, 'click', function(){
                infoWindow.setContent(html);
                infoWindow.open(map, marker);
            });
        }
        function downloadUrl(url, callback) {
            var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest;
            request.onreadystatechange = function() {
                if (request.readyState == 4) {
                    request.onreadystatechange = doNothing;
                    callback(request, request.status);
                }
            };
            request.open('GET', url, true);
            request.send(null);
        }
        function doNothing() {}
        //]]>

    </script>
</head>
<body onload="load()">
    <div id="map" style="width: 900px; height: 750px;"></div>
    <ul>
        <a href="#">Restaurant</a>
    </ul>
</body>
</html>

genxml3.php:

<?php  
require("dbinfo.php"); 
// Start XML file, create parent node
$dom = new DOMDocument("1.0");
$node = $dom->createElement("map");
$parnode = $dom->appendChild($node); 
// Opens a connection to a MySQL server
$connection=mysql_connect('localhost', $username, $password);
if (!$connection) {  die('Not connected : ' . mysql_error());} 
// Set the active MySQL database
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
    die ('Can''t use db : ' . mysql_error());
} 
// Select all the rows in the markers table
// Checks for the 'GET' variable, if there isn't, run normal XML script,
// if there is, get the restriction/filter and query from the database 
// with the filter
if (!empty($_GET)) {    
    $filter = $_GET['f'];
    $query = "SELECT * FROM markers WHERE type = '$filter'";
} else {
    $query = "SELECT * FROM markers WHERE 1";
}
$result = mysql_query($query);
if (!$result) {  
    die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml"); 
// Iterate through the rows, adding XML nodes for each
while ($row = mysql_fetch_assoc($result)){  
  // ADD TO XML DOCUMENT NODE  
  $node = $dom->createElement("marker");  
  $newnode = $parnode->appendChild($node);   
  $newnode->setAttribute("name",$row['name']);
  $newnode->setAttribute("address", $row['address']);  
  $newnode->setAttribute("lat", $row['lat']);  
  $newnode->setAttribute("lng", $row['lng']);   
  $newnode->setAttribute("type", $row['type']);
} 
echo $dom->saveXML();
?>

PHP脚本生成以下XML代码：

<map> 
    <marker name="Pan Africa Market changed" address="1521 1st Ave, Seattle, WA"     lat="47.6089" lng="-122.34" type="restaurant"/> 
    <marker name="Buddha Thai & Bar" address="2222 2nd Ave, Seattle, WA" lat="47.6136" lng="-122.344" type="bar"/> 
    <marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.6246" lng="-122.356" type="restaurant"/> 
    <marker name="Ipanema Grill" address="1225 1st Ave, Seattle, WA" lat="47.6064" lng="-122.338" type="restaurant"/> 
    <marker name="Sake House" address="2230 1st Ave, Seattle, WA" lat="47.6128" lng="-122.346" type="bar"/> 
    <marker name="Crab Pot" address="1301 Alaskan Way, Seattle, WA" lat="47.606" lng="-122.34" type="restaurant"/> 
    <marker name="Mama's Mexican Kitchen" address="2234 2nd Ave, Seattle, WA" lat="47.614" lng="-122.345" type="bar"/> 
    <marker name="Wingdome" address="1416 E Olive Way, Seattle, WA" lat="47.6172" lng="-122.327" type="bar"/> 
    <marker name="Piroshky Piroshky" address="1908 Pike pl, Seattle, WA" lat="47.6101" lng="-122.343" type="restaurant"/> 
</map>

当我在导航栏中强制使用"get"变量时（即：genxml3.php？f=restaurant），会输出以下XML代码：

<map>    
    <marker name="Pan Africa Market changed" address="1521 1st Ave, Seattle, WA" lat="47.6089" lng="-122.34" type="restaurant"/>
    <marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.6246" lng="-122.356" type="restaurant"/>
    <marker name="Ipanema Grill" address="1225 1st Ave, Seattle, WA" lat="47.6064" lng="-122.338" type="restaurant"/>
    <marker name="Crab Pot" address="1301 Alaskan Way, Seattle, WA" lat="47.606" lng="-122.34" type="restaurant"/>
    <marker name="Piroshky Piroshky" address="1908 Pike pl, Seattle, WA" lat="47.6101" lng="-122.343" type="restaurant"/>    
</map>

所以我知道PHP脚本中的逻辑是有效的，因为它过滤了所需的代码。因此，如果我在"f=餐厅"中只显示"餐厅"类型的标记，如果我使用"f=酒吧"也是如此。

但是JavaScript仍然只使用第一个XML代码。如何让JavaScript代码使用第二个XML代码（应用了过滤器的代码）。

因此，我现在正在寻找一种方法，当按下map.html文件中的链接时，使用新的XML代码运行JavaScript代码？

WELL。。。您的XML（第二个标记节点，name属性）没有语法错误：必须使用实体&amp;转义&和号。

实际上，PHP应该自动执行，你使用旧版本吗？

正如在对PHP的回答中所说的那样-htmlenties（）足以创建xml安全值吗，将PHP更改为

// Iterate through the rows, adding XML nodes for each
while ($row = @mysql_fetch_assoc($result)){  
  // ADD TO XML DOCUMENT NODE  
  $node = $dom->createElement("marker");  
  $newnode = $parnode->appendChild($node);   
  $newnode->setAttribute("name", htmlspecialchars($row['name']));
  $newnode->setAttribute("address", htmlspecialchars($row['address']));  
  $newnode->setAttribute("lat", htmlspecialchars($row['lat']));  
  $newnode->setAttribute("lng", htmlspecialchars($row['lng']));   
  $newnode->setAttribute("type", htmlspecialchars($row['type']));
}

尝试一下。。。

XML输出现在应该看起来像

<map> 
<marker name="Pan Africa Market changed" address="1521 1st Ave, Seattle, WA"     lat="47.6089" lng="-122.34" type="restaurant"/> 
<marker name="Buddha Thai &amp; Bar" address="2222 2nd Ave, Seattle, WA" lat="47.6136" lng="-122.344" type="bar"/> 
<marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.6246" lng="-122.356" type="restaurant"/>

您可以在map.html上应用GET参数，并使用Javascript将其处理到您的genxml3.php（map.html？f=restaurant--->genxml3.php？f=restaurant）。

要做到这一点，你需要定义你的链接：

<a href="map.html?f=restaurant">Restaurant</a>
<a href="map.html?f=bar">Bar</a>

然后通过JS或jQuery:解析GET参数（如果您只期望这个参数）

var param = location.search;

现在，当页面刷新时，您只需执行通常的加载（），在那里您调用downloadUrl（）并添加map.html 后面的部分

downloadUrl("genxml3.php" + param, function(data) {

这是一个非常简单的解决方案，因为根本没有检查参数，但这是你的部分，这取决于你的需求。

如果你根本不想刷新页面，那么你可以为你的链接分配一个函数，该函数给定一个参数（过滤器名称）：

<a href="javascript:setFilter('restaurant');" title="">Restaurant</a>

您也可以使用jQuery，为所有链接分配一个事件，并读取它们的innerHTML（值）。我不确定我是否理解你的问题，希望我能帮上忙。

相关文章：