javascript - 使用jquery设置下拉列表中第一个选项的值

Question

所以我正在尝试使用 jquery 填充我的模态表单，但我无法使下拉列表工作。我是 jquery 的新手，所以我不确定我做的事情是否正确。这就是我使用数据将值传递给 jquery 的方式:

<a class="btn btn-primary btn-xs" data-toggle="modal" data-target="#editItem" data-id="<?php echo $row_selectItem['item_id'];?>" data-no="<?php echo $row_selectItem['item_no'];?>" data-desc="<?php echo $row_selectItem['item_desc'];?>" data-cat="<?php echo $row_selectItem['cat_name'];?>" data-unit="<?php echo $row_selectItem['unit_name'];?>" data-quantity="<?php echo $row_selectItem['quantity'];?>" data-cost="<?php echo $row_selectItem['unit_cost'];?>" >

这就是我在 jquery 上设置值并以模态形式显示它们的方式:

$('#editItem').on('show.bs.modal', function (e) {
              var id = $(e.relatedTarget).data('id');
              var no = $(e.relatedTarget).data('no');
              var desc = $(e.relatedTarget).data('desc');
              var cat = $(e.relatedTarget).data('cat');
              var unit = $(e.relatedTarget).data('unit');
              var cost = $(e.relatedTarget).data('cost');
              var quantity = $(e.relatedTarget).data('quantity');
              $("#item_id").val(id);
              $("#item_no").val(no);
              $("#item_desc").val(desc);
              $("#category option:first").val(cat);
              $("#unit option:first").val(unit);
              $("#unit_cost").val(cost);
              $("#quantity").val(quantity);
            });

            $('#editItem').on('hidden.bs.modal', function () {
          $(this).removeData('bs.modal');
        })

类别和单位是下拉列表。这是以前的值应该显示为下拉列表中的第一个选项的地方。其余的正在工作。

这是我以模态形式选择的代码。我不会包括其余的，只包括单位和类别的选择。任何帮助将不胜感激:)

<div class="form-group">
  <select class="form-control" id="category" name="category">
    <option value=""></option> //value should be here
  </select>
  <span class="help-block"></span>
</div>
<div class="form-group">
  <select class="form-control" name="unit" id="unit">
    <option value=""></option>//value should be here
  </select>
  <span class="help-block"></span>
</div>

Answer 1

假设那是你的 HTML 代码

你可以试试这个

$("#category > option:first-child").val(cat);
$("#unit > option:first-child").val(unit);

如果您还想为选项设置文本:

$("#category > option:first-child").text(cat);
$("#unit > option:first-child").text(unit);

但是，如果您的选择值已经包含选项列表，并且您想删除所选的选项并将其添加到顶部，那么您可以这样做

if($('#category > option[value=' + cat + ']').length !== 0){
    $('#category > option[value=' + cat + ']').remove();
}    
$('#category').prepend(new Option(cat, cat));