【问题标题】：passing php variables to html with the right format以正确的格式将 php 变量传递给 html
【发布时间】：2015-01-18 12:27:11
【问题描述】：

我对编程非常陌生，因此有一些“疑问”。我没有排序的一个是关于如何将某种格式的数据从 php 传递到 html。关于交流。

我想要做的是使用这部分程序在谷歌地图中插入 gps 位置。

有效的一点：我可以像单个字符串一样将数据从 php 导出到 html 如果我输入数据表单html，我可以根据需要绘制地图

我的理解是 php 数组的格式与 html var 所需的输入不兼容。这是代码

<!DOCTYPE html>
<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
  <title>Google Maps Multiple Markers</title> 
  <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
  <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.1.min.js"></script>
</head> 
<body>
  <div id="map" style="width: 500px; height: 400px;"></div>

  <script type="text/javascript">
    // Define your locations
    **var locations = [
      ['<h4>One</h4>', -30.2, 100.6],
      ['<h4>Two</h4>', -31.2, 100.7],
      ['<h4>Three</h4>', -32.2, 100.8]
    ];**


    var iconURLPrefix = 'http://maps.google.com/mapfiles/ms/icons/';

    var icons = [
      iconURLPrefix + 'red-dot.png',
      iconURLPrefix + 'green-dot.png',
      iconURLPrefix + 'blue-dot.png',
      iconURLPrefix + 'orange-dot.png'
    ]
    var icons_length = icons.length;


    var shadow = {
      anchor: new google.maps.Point(15,33),
      url: iconURLPrefix + 'msmarker.shadow.png'
    };

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      center: new google.maps.LatLng(-37.92, 151.25),
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      mapTypeControl: false,
      streetViewControl: false,
      panControl: false,
      zoomControlOptions: {
         position: google.maps.ControlPosition.LEFT_BOTTOM
      }
    });

    var infowindow = new google.maps.InfoWindow({
      maxWidth: 160
    });

    var marker;
    var markers = new Array();

    var iconCounter = 0;

    // Add the markers and infowindows to the map
    for (var i = 0; i < locations.length; i++) {  
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map,
        icon : icons[iconCounter],
        shadow: shadow
      });

      markers.push(marker);

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));

      iconCounter++;
      if(iconCounter >= icons_length){
        iconCounter = 0;
      }
    }

    function AutoCenter() {
      //  Create a new viewpoint bound
      var bounds = new google.maps.LatLngBounds();
      //  Go through each...
      $.each(markers, function (index, marker) {
        bounds.extend(marker.position);
      });
      //  Fit these bounds to the map
      map.fitBounds(bounds);
    }
    AutoCenter();
  </script> 
</body>
</html>

理想情况下，我想用我已经在 php 中构建的变量替换 var 位置（到目前为止是在同一页面中构建的），然后将其传递给 var 位置。

我尝试通过以下方式传递数组：

    <?php
$locations = array();
for ($x = 0; $x <= 3; $x++) {
$locations[] = ['One',$x,$x+1,$x+2];

}
$loc = $_POST[$locations];
//$loc = $_POST['<h4>Bondi Beach</h4>, -33.890542, 151.274856'];
print_r ($locations);

?>
<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var cars = <?php print_r ($loc); ?>;
document.getElementById("demo").innerHTML = cars;
</script>

</body>
</html>

但没有运气。无论如何都可以支持吗？非常感谢

----------------------------------------------- --------------

更新！！！感谢大家，我设法确定如何传递变量

<?php
$arr = array("Bondi Beach",",-33.890542",",151.274856");
?>

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var locations = <?php echo json_encode($arr) ?>;
document.getElementById("demo").innerHTML = locations[1];
</script>
</body>
</html>

现在下一步是尝试传递一个数组...尝试了以下但再次不起作用...

<?php
$arr = array();
for ($x = 0; $x <= 3; $x++) {
$arr[] = ["One",$x,$x*2];
};
?>

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var arr = new Array(3);
for (i = 0; i <= 3; $i++) {
arr[i] = <?php echo json_encode($arr[i]) ?>;
}
document.getElementById("demo").innerHTML = arr[1];
</script>
</body>
</html>

也许是个太天真的尝试……

排序

感谢大家的支持。我希望很快见到你（作为我网站的成员！）

非常感谢:-)
伊曼纽尔

【问题讨论】：

w3schools.com/json
@Murplyx 试图引导 JSON 的奇妙世界。一种设计用于在语言和其他来源之间传输数据的语言。 javascript 和 PHP 都可以将对象编码和解码为 JSON，使它们可以互换。
@Murplyx 你刚刚评论了一个链接。该链接重定向到解释 JSON 的页面。看来 OP 对 JSON 并不十分熟悉。一些解释可能是必要的。我试图为您的评论提供更多关于 OP 的背景信息。
接受一个帮助您朝着正确方向发展的答案是件好事。
@Mouser 我想投票给最佳答案，但还没有这样做的声誉（我需要 15 个而不是我实际的 6 个），再次感谢大家

标签： javascript php html google-maps format

【解决方案1】：

JSON：一种设计用于在语言和其他来源之间传输数据的语言。 JavaScript 和 PHP 都可以将对象编码和解码为 JSON，使它们可以互换。这是传输数据的现代和最常见的方式。 XML 仍在使用，但比 JSON 产生更多开销。

<script>
var cars = <?php json.encode($loc); ?>;
document.getElementById("demo").innerHTML = cars.join(", ");
</script>

上面的代码会将 PHP 数组对象 转换为带有json_encode 的JSON。 JavaScript 将JSON string 解析为一个javascript 数组对象。函数join 可以让你看到结果。

要实际检索值，请使用：

cars[0]; //<h4>Bondi Beach</h4>
cars[1]; //-33.890542
cars[2]; //151.274856

【讨论】：

【解决方案2】：

JSON 是 JavaScript Object Notation，你可以使用 php 函数 json_encode http://php.net/manual/en/function.json-encode.php

【讨论】：

虽然此链接可能会提供答案，但最好在您的帖子中解释答案的关键部分。链接和内容发生变化。
真的需要 JSON.parse 函数吗？你可以简单地用 PHP 打印 javascriptcode。
如果不是，它将被渲染为字符串而不是对象。
呈现为 javascript 数组定义。你用php打印javascriptcode