Fatal编程技术网
  • javascript/
  • Javascript 我想在我的网页上显示led开/关

Javascript 我想在我的网页上显示led开/关

javascript php html raspberry-pi

Javascript 我想在我的网页上显示led开/关,javascript,php,html,raspberry-pi,Javascript,Php,Html,Raspberry Pi,我正在使用树莓pi实现建筑自动化。我只想在网页上显示led开/关。如果从mysql数据库中获取1“led在1上显示零状态”或0“led在0上显示高状态” 这是我的密码。我想用红色led png文件替换灰色led png，我在JavaScript变量中存储了值。但我认为我的javascript函数或if-else语句有问题 <?php $db_host = 'localhost'; // Server Name $db_user = 'root'; // Username $db_pass

我正在使用树莓pi实现建筑自动化。我只想在网页上显示led开/关。如果从mysql数据库中获取1“led在1上显示零状态”或0“led在0上显示高状态”

这是我的密码。我想用红色led png文件替换灰色led png，我在JavaScript变量中存储了值。但我认为我的javascript函数或
if-else
语句有问题

<?php
$db_host = 'localhost'; // Server Name
$db_user = 'root'; // Username
$db_pass = '******'; // Password
$db_name = '*******'; // Database Name

$conn = mysqli_connect($db_host, $db_user, $db_pass, $db_name);
if (!$conn) {
    die ('Failed to connect to MySQL: ' . mysqli_connect_error());  
}

$sql = 'SELECT dev1 FROM `76Hlog` ORDER BY `Serial` DESC LIMIT 1';

$query = mysqli_query($conn, $sql);

if (!$query) {
    die ('SQL Error: ' . mysqli_error($conn));
}
?>


<html>
<body>

<?php


        while ($row = mysqli_fetch_array($query))
        {

            $s1 = $row['dev1'];
                        echo $s1;                  

        }?>


<img id="myImage" src="/image-folder/ioff.png" width="50" height="50">



<script>



var val = <?php echo $s1; ?>;



function changeImage() {
    var image = document.getElementById('myImage');
    if (val == "1") {
        image.src = "/image-folder/ioff.png";
    } else if (val == "0") {
        image.src = "/image-folder/ion.png";
    }
}
</script>


<h1>the value for number is:  
 <script>
        document.write(val)
      </script></h1>


</body>
</html>


var-val=；
函数changeImage（）{
var image=document.getElementById（'myImage'）；
如果（val=“1”）{
image.src=“/image folder/ioff.png”；
}否则如果（val==“0”）{
image.src=“/image folder/ion.png”；
}
}
数字的值为：
文件写入（val）
看起来没问题，但我不知道你为什么要买这一行 
while（$row=mysqli\u fetch\u array（$query））
为什么在一段时间内需要这个

还请注意，这将运行一次，如果您希望图像自动替换，则不会发生这种情况，要在不刷新页面的情况下发生这种情况，您需要创建一个AJAX请求。

您是否尝试过在php返回的值中添加引号

var val = "<?php echo $s1; ?>";

var val=”“；
确定只需在body load上调用javascript函数。 当它加载时，php将运行，当body完成加载时，它将设置所需的映像

<body onload="changeImage()">
稍后我将编辑while loop，但我的主要关注点是刷新页面后无法加载图像文件。它只显示“ioff.png”，如果我在var中得到0值，则不会更改为“ion.png”。在尝试设置“ion.png”之前是否有任何错误？例如，如果它无法检索到第一个图像，可能会使整个页面卡住。我在我的页面上获取ioff.png。ChangeImage从未被调用。我能够将值存储在val变量中，并用document对其进行了检查。write（val）Hi，bundle感谢您的添加，我忘记调用该函数，现在它正在工作 
function changeImage() {

  //Php code for connecting to database and saving the result in $s1

    var val = <?php echo $s1; ?>;
    var image = document.getElementById('myImage');
    if (val == "1") {
        image.src = "/image-folder/ioff.png";
    } else if (val == "0") {
        image.src = "/image-folder/ion.png";
    }
}

setInterval(changeImage, time_in_milliseconds);