Question

我这里有一小段代码连接到一个名为karaoke的数据库并填充一个选择框。我只希望能够在索引0处添加一个选择框选项，上面写着“请选择”。我尝试了多种方法在PHP，HTML和Javascript中执行此操作，但没有找到我需要的解决方案。到目前为止，这段代码在Chrome调试器中显示0个错误，但未达到我的预期。有人可以告诉我我在做什么错吗？

[2, 3, 4]

Answer 1

您有一个带有id =“ regulars”的div标签。在打印出包含选择元素的$ opt变量之前，该变量也带有id =“ regulars”。 Javascript代码正在查找具有“ regulars” id的第一个元素，该元素将是div。尝试更改div的ID。

如评论中所述， myFunction 函数调用应位于 script 标记中。 option 标签应为 value 属性包含 = 。

 <!DOCTYPE HTML>
 <html>
  <head>
  <title>Add Singer</title>
  </head>
  <body>
  <center><label style = "color: white; font-family:arial; font-size: 24px">Select a Regular</label></center>

<?php
$con = mysqli_connect("localhost","root","","karaoke");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }
  $sql = "Select * FROM regulars ORDER BY Regulars ASC";
  $result = mysqli_query($con, $sql) or die("Bad SQL: $sql");
  $opt = "<select id = 'regulars' name = 'regulars'>";
  while($row = mysqli_fetch_assoc($result)) {
      $opt .= "<option value='{$row['Regulars']}'>{$row['Regulars']}</option>\n";
  }
 $opt .="</select>"
?>

<center> <div id="regularsDiv">
<?php
echo $opt;
?>
</div> </center>

<script>
function myFunction() {
    var x = document.getElementById("regulars");
    var option = document.createElement("option");
    option.text = "Please Select";
    x.add(option, x[0]);
}
myFunction();
</script>
  </body>
</html>

动态创建的选择框不接受功能添加的选项

1 个答案: