Question

我正在尝试使用从php数据库中提取的内容创建一个javascript数组。

<?php

//This creates an array from the database and allows us to use it later in the jquery
//CREATE SQL STATEMENT
$sql_locations = "SELECT * FROM tbllocations";

//CONNECT TO MYSQL SERVER
require('test-connection.php');
//EXECUTE SQL STATEMENT
$rs_locations = mysqli_query($vconnection, $sql_locations);
$rs_locations_rows = mysqli_fetch_assoc($rs_locations);

foreach( $rs_locations as $rs_location ) {
  $markers[] = array(
      "{$rs_location['place']}, {$rs_location['city']}",
     $rs_location['long'],
      $rs_location['lat']
  );
}
?>
<div id="map_wrapper">
    <div id="map_canvas" class="mapping"></div>
</div>


<style>

    #map_wrapper {
        height: 400px;
    }

    #map_canvas {
        width: 100%;
        height: 100vh;
    }


</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>

    function initialize() {
        var map;
        var bounds = new google.maps.LatLngBounds();
        var mapOptions = {
            mapTypeId: "roadmap",
            center: new google.maps.LatLng(47.608941, -122.340145), // somewhere in the uk BEWARE center is required
            zoom: 3,
        };

        // Display a map on the page
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
        map.setTilt(45);

        // Multiple Markers
        var markers = <?php echo json_encode( $markers ); ?>;

        // Info Window Content
        var infoWindowContent = [

            <?php while($rs_location_rows = mysqli_fetch_assoc($rs_location)) { ?>

            ['<div class="info_content">' +

            '<h3><?php echo $rs_locations_rows['branch']; ?></h3>' +

            '<p><?php echo $rs_locations_rows['content']; ?></p>' + 

            '<p><?php echo $rs_locations_rows['phone']; ?></p>' + 

            '</div>']

            <?php } ?>


        ];

        // Display multiple markers on a map
        var infoWindow = new google.maps.InfoWindow();
        var marker, i;

        // Loop through our array of markers & place each one on the map
        for (i = 0; i < markers.length; i++) {
            var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
            bounds.extend(position);
            marker = new google.maps.Marker({
                position: position,
                map: map,
                title: markers[i][0]
            });

            // Allow each marker to have an info window
            google.maps.event.addListener(marker, 'click', (function (marker, i) {
                return function () {
                    infoWindow.setContent(infoWindowContent[i][0]);
                    infoWindow.open(map, marker);
                }
            })(marker, i));

            // Automatically center the map fitting all markers on the screen
            map.fitBounds(bounds);
        }

        //Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
        var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function (event) {
            this.setZoom(10);
            google.maps.event.removeListener(boundsListener);
        });

    }
    google.maps.event.addDomListener(window, 'load', initialize);


</script>

我已更新代码以显示整个页面。我在此期间尝试了这个循环，并添加了阻止我的页面生成和输出我的地图，所以我的页面将挂起。

我正在考虑为每个循环执行一个与我为标记完成相同的方式，但到目前为止我没有成功

Answer 1

您只需将do while结构更改为while：正如@RiggsFolly所提到的那样。（对不起，我现在看到了）

var infoWindowContent = [

    <?php while($rs_location_rows = mysqli_fetch_assoc($rs_location)) { ?>

    ['<div class="info_content">' +

    '<h3><?php echo $rs_locations_rows['branch']; ?></h3>' +

    '<p><?php echo $rs_locations_rows['content']; ?></p>' + 

    '<p><?php echo $rs_locations_rows['phone']; ?></p>' + 

    '</div>'],

    <?php } ?>

];

Answer 2

这是我用来做的方法：

var myArray = [
    <?php while ($rs_location_rows = mysqli_fetch_assoc($rs_location)) : ?>
    {
        'branch' : '<?= $rs_locations_rows["branch"] ?>',
        'content' : '<?= $rs_locations_rows["content"] ?>',
        'phone' : '<?= $rs_locations_rows["phone"] ?>'
    },
    <?php endwhile; ?>
];
console.log(myArray);

现在你的js中有数组。

Answer 3

由于您基本上是在尝试构建一个包含一些js代码的字符串，然后将其直接传递给浏览器，我将在PHP中构建一个字符串，然后一次性回显该批次。它更容易看到你在做什么。

<?php
$js = '<script type="text/javascript">';
$js .= 'var infoWindowContent = [';

while( $row = mysqli_fetch_assoc($rs_location)) { 

    $js .= "['" . '<div class="info_content">';
    $js .= "<h3>{$row['branch']}</h3>";
    $js .= "<p>{$row['content']}</p>";
    $js .= "<p>{$row['phone']}</p>";    
    $js .= "</div>'],";    
}

// trim off the js interpreter breaking trailing comma
$js = rtrim( $js, ',' );

// close the outer array
$js .= '];';
$js .= '</script>';

echo $js;
?>

每个循环的Javascript和PHP输出一个数组

3 个答案: