[英]How to pass array values from PHP to JavaScript?
好的。 所以我整天都在這里,閱讀並關注有關該主題的所有解決方案,但我一無所獲。 什么都沒有。 您能通過完整且易於理解的示例向我展示如何做到這一點。 我是JavaScript和PHP的新手,所以如何從PHP文件到JavaScript獲取數組值。 我嘗試這樣做: var locations = <?php echo json_encode($location); ?>;
var locations = <?php echo json_encode($location); ?>;
但我給我錯誤。 沒有人回答為什么。 這段代碼在這里:
<!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" type="text/javascript"></script> </head> <body> <div id="map" style="width: 500px; height: 400px;"></div> <script type="text/javascript"> var locations = [ ['Municipal Hall', 6.414333734068895, 125.61093270778656, 1], ['Camarillo Household', 6.4345278, 125.58975, 2], ['Perez Household', 6.4343889, 125.59202777777777, 3], ['Usman Household', 6.4338056, 125.59191666666666, 4], ['Lim Household', 6.4333889, 125.59419444444444, 5] ]; var map = new google.maps.Map(document.getElementById('map'), { zoom: 10, center: new google.maps.LatLng(6.40, 125.60), mapTypeId: google.maps.MapTypeId.ROADMAP }); var infowindow = new google.maps.InfoWindow(); var marker, i; for (i = 0; i < locations.length; i++) { marker = new google.maps.Marker({ position: new google.maps.LatLng(locations[i][1], locations[i][2]), map: map }); google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { infowindow.setContent(locations[i][0]); infowindow.open(map, marker); } })(marker, i)); } </script> </body> </html>
我想從數據庫中的值更改變量locations
的值。 所以我得到了這個PHP文件:
<?php $servername = "host"; $username = "username"; $password = "password"; $dbname = "dbname"; // Create connection $conn = mysqli_connect($servername, $username, $password, $dbname); // Check connection if (!$conn) { die("Connection failed: " . mysqli_connect_error()); } $sql='SELECT a.Household_Name, b.Latitude, b.Longitude FROM household a, location b WHERE a.Household_ID = b.Household_ID;'; $result = mysqli_query($conn, $sql); if(mysqli_num_rows($result) > 0){ // output data of each row for($i=0;$i<mysqli_num_rows ( $result );$i++){ $row=mysqli_fetch_row($result); $location[]= array($row[0].', '.$row[1].', '.$row[2].','.($i+1)); //echo "Household Name: " . $row[0]. " - Latitude: " . $row[1]. " - Longitude " . $row[2]. " " .($i+1)."<br>"; } }else{echo "0 results";} ?>
它工作正常。 它從數據庫輸出數據。 現在我想知道的是如何將數據庫中的值轉換為可以代替locations
變量使用的值,以便標記將出現在地圖上? var locations = <?php echo json_encode($location); ?>;
這個家伙給我錯誤,我按照我的所有指示進行操作,但仍然是錯誤的。 您是否可以修改我的代碼以使其起作用,還是可以在您所知的工作/功能代碼中向我指出。 請幫我。 我在這里很麻煩。
嘗試從以下location[]
更改location[]
變量:
$location[]= array($row[0].', '.$row[1].', '.$row[2].','.($i+1));
至
$location[]= array($row[0],$row[1],$row[2],($i+1));
我在下面添加了完整的代碼及其工作方式:
<?php
$servername = "host";
$username = "username";
$password = "password";
$dbname = "dbname";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$sql='SELECT a.Household_Name, b.Latitude, b.Longitude FROM household a, location b WHERE a.Household_ID = b.Household_ID;';
$result = mysqli_query($conn, $sql);
if(mysqli_num_rows($result) > 0){
// output data of each row
for($i=0;$i<mysqli_num_rows ( $result );$i++){
$row=mysqli_fetch_row($result);
$location[]= array($row[0],$row[1],$row[2],($i+1));
//echo "Household Name: " . $row[0]. " - Latitude: " . $row[1]. " - Longitude " . $row[2]. " " .($i+1)."<br>";
}
}else{echo "0 results";
}
?>
<!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"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 500px; height: 400px;"></div>
<script type="text/javascript">
/*var locations = [
['Municipal Hall', 6.414333734068895, 125.61093270778656, 1],
['Camarillo Household', 6.4345278, 125.58975, 2],
['Perez Household', 6.4343889, 125.59202777777777, 3],
['Usman Household', 6.4338056, 125.59191666666666, 4],
['Lim Household', 6.4333889, 125.59419444444444, 5]
];*/
var locations = <?php echo json_encode($location); ?>;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: new google.maps.LatLng(6.40, 125.60),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
</body>
</html>
如果您的代碼是,則您的數組不是“真正”的數組:
$location[]= array($row[0].', '.$row[1].', '.$row[2].','.($i+1));
我認為結果將是這樣的:
<script type="text/javascript">
var locations = [["Municipal Hall, 6.414333734068895, 25.61093270778656, 1"],["Camarillo Household', 6.4345278, 125.58975, 2"],......];
.....
</script>
嘗試:
$location[]= array($row[0],$row[1],$row[2],($i+1));
編輯:我不建議使用此方法將PHP數組傳遞給JS,因為它會使html頁面超載並且導航器無法處理數組的內容。 更好的方法是在加載此http://api.jquery.com/jquery.ajax/的頁面上使用Ajax函數
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.