Javascript 如何根据mysql数据库中的值在html中显示（onload）开/关按钮？

我想根据mysql数据库表中的值（该表只有一行）显示onload（某种）切换按钮，并且当我单击它时，我想将同一表中的值从0更改为1或相反。我看到了很多关于相关问题的答案，但似乎没有一个对我有用。非常需要一些帮助。非常感谢

以下是我的php代码：

 <?php
 include 'db_ecoheating.php';
 mysql_connect($dbhost,$dbuser,$dbpass)  
or die ("Unable to connect to database");  

mysql_select_db($dbname)  
or die ("Unable to select database");  

$sql = "SELECT coil1 from coils ";
$result = mysql_query($sql);

while($row = mysql_fetch_array($result)){
    $coil1 = $row['coil1'];

}
$arr = array(
  'value1'=> $coil1,
);
echo json_encode($arr);
  ?>

还有我的图像（用作按钮）：

---

虽然使用JS的想法还可以，但可以使用普通的PHP和HTML/CSS。 我还建议您开始使用mysqli/PDO

/*CSS */
.button0 {background-image: url("Button1.png");}
.button1 {background-image: url("Button2.png");}

然后，要显示您的按钮，请使用以下PHP代码

 <?php
 include 'db_ecoheating.php';
 mysql_connect($dbhost,$dbuser,$dbpass) or die ("Unable to connect to database");  

 mysql_select_db($dbname)  or die ("Unable to select database");  

 $sql = "SELECT * FROM coils";
 $result = mysql_query($sql);

 while($row = mysql_fetch_assoc($result)){
 $value = $row['coil1']; ?>

 <input class="button<?php echo $value; ?>" type="image" onclick="saveData()" id="coil1"/>

<?php } ?>

显然，它在识别“按钮”时有问题。它将其作为字符串。更正了查询，还更改了CSS类以匹配表中的0和1值。我假设您的coils表在coil1列中只有一行。如果有更多行，则需要找到一种方法来过滤查询。顺便提一下我认为，您不需要发布的JQuery/AJAX代码。这在很大程度上取决于您的其他代码的外观。我仍然存在这个问题，我尝试使用php（带有echo）显示html代码，但不起作用。谢谢你的回答！
/*CSS */
.button0 {background-image: url("Button1.png");}
.button1 {background-image: url("Button2.png");}

 <?php
 include 'db_ecoheating.php';
 mysql_connect($dbhost,$dbuser,$dbpass) or die ("Unable to connect to database");  

 mysql_select_db($dbname)  or die ("Unable to select database");  

 $sql = "SELECT * FROM coils";
 $result = mysql_query($sql);

 while($row = mysql_fetch_assoc($result)){
 $value = $row['coil1']; ?>

 <input class="button<?php echo $value; ?>" type="image" onclick="saveData()" id="coil1"/>

<?php } ?>