在 HTML 下拉列表中显示选定的 JS 值

Question

早上好，

我正在使用 javascript 代码从我的数据库中检索我的数据并在文本字段 (HTML) 中显示内容。这也很有效。我想在下拉菜单中而不是在文本字段中显示值（编号 6）。内容应相应地“选择”。我该如何实施？不幸的是，我没有更进一步。

编辑：有错误消息。对此感到抱歉。我认为它来自 JS 代码，因为它无法在那里分配变量，但它们在我的原始文件中工作，因为它们与那里的其他人有联系。

$(document).ready(function () {
    $('.editbtn').on('click', function() {
        
        $('#editmodal').modal('show');

        
            $tr = $(this).closest('tr');

            var data = $tr.children("td").map(function() {
                return $(this).text();
            }).get();

            console.log(data);

            $('#update_id').val(data[0]);
                  $('#name').val(data[1]);
                  $('#birth').val(data[2]);
            $('#sex').val(data[3]);
            $('#adress').val(data[4]);
                  $('#number').val(data[5]);
            $('#qualification').val(data[6]);
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- *********** Database ***********

<?php

$pdo = new PDO('mysql:host=localhost;dbname=', 'root', '');

$sql = "SELECT * FROM users";
foreach ($pdo->query($sql) as $row7) {
                                                
}
?>

-->

<div class="modal fade" id="editmodal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel"> User </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>

<form action="updatecode.php" method="POST">
<div class="modal-body">
            
 <input type="hidden" name="update_id" id="update_id">
        <div class="form-row">
            <div class="col-6">
                    <label>Name</label>
                        <input type="text" class="form-control" name="name" id="name">
            </div>
            <div class="col-6">
                     <label>Birth</label>
                        <input type="text" name="birth" id="birth" class="form-control">
            </div>
        </div>
        <P>
      <div class="form-row">
        <div class="col-6">
             <label>Sex</label>
               <input type="text" name="sex" id="sex"  class="form-control">
      </div>
      <div class="col-6">
              <label>Adress</label>
                <input type="text" name="adress" id="adress"  class="form-control">
      </div>
      </div>
      <P>
            <div class="form-row">
                 <label>Number</label>
                            <div class="col-12">
                                <input type="text" name="number" id="number" class="form-control">
            </div>
            </div>
            <P>
            <hr>
            <P>
      <div class="form-group">
                <label>Qualification</label>
                 <select class="form-control" name="qualification">
                            //   <?php  if ($row7['qualification'] === "Mechanic"){?> 
                            <option value="Mechanic" selected='selected'>Mechanic</option>
                            <option value="Locksmith">Locksmith</option>
                            <option value="Electriciane">Electrician</option>
                            // <?php }elseif ($row7['qualification'] === "Locksmith"){?>
                            <option value="Mechanic">Mechanic</option>
                            <option value="Locksmith" selected='selected'>Locksmith</option>
                            <option value="Electrician">Electrician</option>
                            //  <?php }elseif ($row7['qualification'] === "Electrician"){?> 
                            <option value="Mechanic">Mechanic</option>
                            <option value="Locksmith">Locksmith</option>
                            <option value="Electrician" selected='selected'>Electrician</option>
              //    <?php } ?> 
           </select>
        </div>
      </div>
    </div>
</div>
<div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal"><i class="fa fa-times-circle" aria-hidden="true"></i> Close</button>
        <button type="submit" name="updatedata" class="btn btn-success"><i class="fa fa-share" aria-hidden="true"></i>Save</button>
              </div>
        </form>
    </div>
  </div>
</div>

Answer 1

我找到了解决办法：

我要加$('#intervall').find(":selected").text();

现在可以了！ :)