將數組從php傳遞到javascript
[英]Pass an array from php to javascript
問題描述
我正在嘗試將數組從php（在單獨的文件中）傳遞給JavaScript並更新HTML表。 php端的數組是MySQL查詢的結果。 這是我到目前為止所做的：
function updateSensorsTable() {
$.getJSON("/getTableFromDB.php", function (json) {
for (i = 0; i < 8;i++ )
document.getElementById(i).innerHTML = json[i];
});
}
<?php
include("connect_to_mysql.php");
$result = mysql_query("SELECT value FROM sens" );
while ($row = mysql_fetch_row($result)) {
$php_array[]=$row[0];
}
echo json_encode($php_array);
?>
2 個解決方案
解決方案1
0 2015-02-10 16:42:16
不要忘記設置標題：
header('Content-Type: application/json');
當您執行“document.getElementById（i）”時，您嘗試訪問具有錯誤ID（整數）的元素...以下是規則：
ID和NAME令牌必須以字母（[A-Za-z]）開頭，后面可以跟任意數量的字母，數字（[0-9]），連字符（“ - ”），下划線（“_”） ，冒號（“：”）和句號（“。”）。
解決方案2
0 2015-02-11 07:26:13
這是完整的頁面
<script type="text/javascript" > setInterval(updateSensorsTable, 2000); setInterval(updatePower, 1000); function showValue(value) { //show value in html document.getElementById("brightnesValue").innerHTML = value; //Set brightness value to DB id=10 callPage('/setValueToDB.php?value=' + value + '& id=10' + '', document.getElementById('')); } function TurnLedOn() { //TODO: need to set the led state and update the sql server document.getElementById("ledStatus").src = "/LedOn.png"; callPage('/setValueToDB.php?value=1&id=9' + '', document.getElementById('')); } function TurnLedOff() { //TODO: need to set the led state and update the sql server document.getElementById("ledStatus").src = "/LedOff.png"; callPage('/setValueToDB.php?value=0&id=9' + '', document.getElementById('')); } function AjaxCaller() { var xmlhttp = false; try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } if (!xmlhttp && typeof XMLHttpRequest != 'undefined') { xmlhttp = new XMLHttpRequest(); } return xmlhttp; } function callPage(url, div) { var ajax = AjaxCaller(); ajax.open("GET", url, true); ajax.onreadystatechange = function () { if (ajax.readyState == 4) { if (ajax.status == 200) { div.innerHTML = ajax.responseText; } } } ajax.send(null); } function updateSensorsTable() { for (i = 0; i < 8; i++) { callPage('/getVarFromDB.php?offset=' + i , document.getElementById(i)); } /* $.getJSON("/getTableFromDB.php", function (json) { for (i = 0; i < 8;i++ ) document.getElementById(i).innerHTML = json[i]; }); */ } function updatePower() { callPage('/getVarFromDB.php?offset=' + 10, document.getElementById('powerValue')); } </script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"/> <title>SmartLight</title> </head> <body bgcolor="#E6E6FA"> <br></br> <table class="sensorsTable" align="center"> <thead> <tr > <th>Sensor</th> <th>Value</th> </tr> </thead> <tbody> <tr> <td align="left">GPS</td> <td align="center" id="0">0</td> </tr> <tr> <td align="left">Temperature</td> <td align="center" id="1">0</td> </tr> <tr> <td align="left">Pressure</td> <td align="center" id="2">0</td> </tr> <tr> <td align="left">Light</td> <td align="center" id="3">0</td> </tr> <tr> <td align="left">Altitude</td> <td align="center" id="4">0</td> </tr> <tr> <td align="left">Accelerometer</td> <td align="center" id="5">0</td> </tr> <tr> <td align="left">Humidity</td> <td align="center" id="6">0</td> </tr> <tr> <td align="left">Camera</td> <td align="center" id="7">0</td> </tr> </tbody> </table> <br></br> <table class="ledTable" align="center"> <tr> <td align="center"><input type="image" src="/TurnOn.png" id="turnOn" width="60" height="60" onclick='TurnLedOn()'></td> <td align="center"><input type="image" src="/TurnOff.png" id="turnOff" width="60" height="60" onclick='TurnLedOff()'></td> <td align="center"><img src="/LedOn.png" style="width:60px;height:60px" id="ledStatus"></td> </tr> <tr> <td align="center" id="ledOnButton">LED On</td> <td align="center" id="ledOffButton">LED Off</td> <td align="center">LED Status</td> </tr> </table> <div align="center"> Brightness: <input type="range" id="brightnesBar" min="0" max="100" value="0" step="1" onchange="showValue(this.value)" /> <span id="brightnesValue">0</span> <table align="center" class="power"> <tr> <td align="center" id="powerValue">0</td> <td align="left">mW</td> </tr> </table> <div align="center" >LED Power Meter</div> </div>
將數組從 javascript 傳遞到 PHP
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.