php单击链接以根据通过jquery post（）发送的ID显示地图

Posted 2023-02-24

【中文标题】php单击链接以根据通过jquery post（）发送的ID显示地图

【英文标题】：php click link to show map based on sent id through jquery post()

【发布时间】：2013-01-17 13:59:58

【问题描述】：

我的 post() 结果只显示其他 map.php 生成的数据，但无法显示地图框。我正在通过 post() 发送 id，它显示了来自 mysql 数据库的确切 php 数据。只有地图 div 是空的。以下是代码。

$(document).ready(function() 
    $(".mylink").click(function()
        var $linkattr = $(this).attr("rel");
//      alert($linkattr);
        $.post("map.php", myid:$linkattr).done(function(data) 
            $("#mapcomeshere").html(data);
            evt.preventDefault();
        );
    );
);

我的 map.php 脚本是

<?php
include('db.php');

$myid = "25";//$_POST['myid'];
$result = mysql_query("select * from property Where Id = '" . $myid ."' AND status = 1");
$row = mysql_fetch_array($result);
echo $row['Id'] . " : " . $row['owner'] . " : " . $row['lnglat'] . $row['propertyadd']  ."<br>";

$maploc = $row['lnglat'];
$myadd = $row['propertyadd'];
?>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  google.maps.event.addDomListener(window, 'load', function() 
    var map = new google.maps.Map(document.getElementById('map'), 
      zoom: 13,
      center: new google.maps.LatLng(24.893379,67.028061),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    );

    var infoWindow = new google.maps.InfoWindow;

    var onMarkerClick = function() 
      var marker = this;
      var latLng = marker.getPosition();
      infoWindow.setContent('<?php echo $myadd ?>');

      infoWindow.open(map, marker);
    ;
    google.maps.event.addListener(map, 'click', function() 
      infoWindow.close();
    );

    var marker1 = new google.maps.Marker(
      map: map,
      position: new google.maps.LatLng(<?php echo $maploc ?>)
    );

    google.maps.event.addListener(marker1, 'click', onMarkerClick);
  );
</script>
hi
<div id="map"></div>

请帮忙

【问题讨论】：

evt.preventDefault(); 位置错误，evt 未定义，因此会抛出错误。始终检查浏览器控制台是否有错误

【参考方案1】：

我可以建议几件事。

首先，你的代码中有一个概念性问题，你写的地方：

  infoWindow.setContent('<?php echo $myadd ?>');

您需要了解PHP是在服务器上处理的，因此不能以这种方式直接由JavaScript执行。这会做什么，就是将 infoWindow 的内容从字面上更改为 ''。

现在，至于您的问题，我认为您通过 AJAX 响应返回所有代码是错误的方式。 JavaScript 应该存在于页面中，map.php 应该只返回数据，可能是 JSON 数据的形式，例如：

map.php:

// ... database stuff, then finally:
echo json_encode(array(
    'map' => array(
        'lat' => 67.028061,
        'long' => 24.893379,
        'zoom' => 13
    ),
    'infoWindowContent' => $myadd,
    //... etc
));

JavaScript 的其余部分属于 $.post() 的回调。

    $.post("map.php", myid:$linkattr).done(function(data) 
        // Not this: $("#mapcomeshere").html(data);
        google.maps.event.addDomListener(window, 'load', function() 
            var map = new google.maps.Map(document.getElementById('map'), data.map);
            // ... setup event handlers, etc ...
        );
    );

这样做的目的是为您的代码提供更简洁的 API。 map.php 的职责只是为地图提供数据，而不是 JavaScript。 JavaScript 都在一个地方。

【讨论】：

infoWindow.setContent('');将内容设置为 $myadd 的值！

是的，你是对的。我误读了。我的其余答案仍然有效，但这不是这样做的方法。

那里还需要有一个dataType: "json"。

以下代码在我想使用地址详细信息 $myid = "25"; 放置动态标记的地方完美运行； //$myid = $_POST['myid']; $result = mysql_query("select * from property Where Id = '" . $myid ."' AND status = 1"); $row = mysql_fetch_array($result);回声 $row['Id'] 。 “：”。 $row['所有者'] 。 “：”。 $row['lnglat'] 。 $row['propertyadd'] .""; $maploc = $row['lnglat']; $myadd = $row['propertyadd'];