$(document).ready(function(){}のsetIntervalに問題があります
私がやっていることは、間隔を設定して、いくつかの MySQL クエリを実行して 4 つのスイッチの状態を確認し、データベース内の値で画面を更新する PHP スクリプトを呼び出すことです。
$(document).ready(function(){
setInterval(function(){
<?php require('fetchSwitchStatuses.php'); ?>
$("#switch1").css('background', 'rgb(<?php echo $switchColor1 ?>)');
$("#switch1").html('<?php echo $switchState1 ?>');
$("#switch2").css('background', 'rgb(<?php echo $switchColor2 ?>)');
$("#switch2").html('<?php echo $switchState2 ?>');
$("#switch3").css('background', 'rgb(<?php echo $switchColor3 ?>)');
$("#switch3").html('<?php echo $switchState3 ?>');
$("#switch4").css('background', 'rgb(<?php echo $switchColor4 ?>)');
$("#switch4").html('<?php echo $switchState4 ?>');
},1000);
});
fetchSwitchStatuses.php のコードは次のとおりです。
$connect = mysqli_connect("localhost", "root", "root");
mysqli_select_db($connect, "db_name");
$fetch1 = mysqli_query($connect,
"SELECT SwitchStatus FROM Switches WHERE PinNumber = '3'"
);
$fetch2 = mysqli_query($connect,
"SELECT SwitchStatus FROM Switches WHERE PinNumber = '5'"
);
$fetch3 = mysqli_query($connect,
"SELECT SwitchStatus FROM Switches WHERE PinNumber = '6'"
);
$fetch4 = mysqli_query($connect,
"SELECT SwitchStatus FROM Switches WHERE PinNumber = '9'"
);
$i = 1;
while($row = mysqli_fetch_array(${'fetch'.$i}))
{
if($row['SwitchStatus'] == 0)
{
${'switchColor'.$i} = "255, 0, 0";
${'switchState'.$i} = "OFF";
}
else if ($row['SwitchStatus'] == 1){
${'switchColor'.$i} = "0, 255, 0";
${'switchState'.$i} = "ON";
}
else {
${'switchColor'.$i} = "100, 100, 100";
${'switchState'.$i} = "ERROR";
}
$i++;
}
mysqli_close($connect);
ページが読み込まれると、情報は正しく、データベースにあるものはすべて画面上の色に反映されます。
オブジェクトをクリックして値を変更すると、必要なすべての変更が行われ、データベースが更新されます。ただし、間隔が繰り返されると問題が発生します。値は、ページがロードされたときの元の値に戻されます。そのため、データベース内の情報は正しく変更されていますが、何らかの理由でボタンの色がクエリによって読み取られた最初の値に常にリセットされます。
画面に反映される情報が正確になるようにするにはどうすればよいですか?