从“选择”返回“范围” - return in span from select

return in span from select

本文关键字：返回范围选择 | 更新日期: 2023-09-27

我有一个小型的学校项目，我正在做。在选择菜单中，我可以选择一个在我的数据库中注册的赌场。这工作正常。但是我需要有一个跨度，我选择我打印的名称。

PHP工作：

<select class="form-control input-sm" name="choosecasino" id="rl_select_casino">
      <option>Choose Casino</option>
          <?php
          $sql ="SELECT * FROM casinos ORDER BY name;";
          $res = $mysqli->query($sql);
          //print($res);
          if($res){                                       
              while($row = $res->fetch_assoc()){
                  ?>
                     <option value="<?php echo $row['c_id'];?>"><?php echo $row['name'];?></option>
                  <?php                                           
              }                               
          }
         ?>                                 
</select>

工作：

<script>
function showSelectedItem() {
    var item = document.getElementById("selectcasino").value;
    document.getElementById("currentcasino").innerHTML = item;
}
    document.getElementById("selectcasino").addEventListener("change", showSelectedItem);
</script>

选择我正在处理的语句：

Casino: <span id="currentcasino">
         <?php
           $sql = "SELECT FROM casinos WHERE name='?'";
           echo $sql;
        ?>
        </span>

我的 sql 语句还需要什么？

此致敬意。

考虑到你已经用jquery标签标记了这个问题，我将假设你有jquery可用（即使你标记为"JQuery Working"的代码是原始的javascript，而不是jQuery）。如果你这样做，这应该对你有用。这是一个示例小提琴

<script>
function showSelectedItem() {
    // take the text of the selected option and inject it into the 'currentcasino' span
    $("#currentcasino").html($("#selectcasino option:selected").text());
}
    $("#selectcasino").on("change", showSelectedItem);
</script>

您可以从currentcasino范围中删除 PHP 代码。

如果你不使用jQuery，它有点复杂，但仍然可以完成。这是这个版本的小提琴

<script>
function showSelectedItem() {
    // take the text of the selected option and inject it into the 'currentcasino' span
    var theSelectedIndex = document.getElementById("selectcasino").selectedIndex;
    var theSelectedText = document.getElementById("selectcasino").options[theSelectedIndex].innerHTML;
    document.getElementById("currentcasino").innerHTML(theSelectedText);
}
    document.getElementById("selectcasino").addEventListener("change", showSelectedItem);
</script>