Question

我正在下载服务列表，但我需要再添加一个静态选项，例如＆＃34;选择服务＆＃34;在动态下拉列表中。

这是我的代码：

if (data[0]) {
    $('#SelectedServiceIds').html("");
    $.each(data, function (key, value) {
        $('#SelectedServiceIds').append(
                 $("<option></option>").attr("value", value.ServiceID).text(value.ServiceName)); 
    });
}

这是我的div：

<div class="col-lg-3 col-sm-6">
    <div class="form-group select-services">

        <select class="form-control"  name="SelectedServiceIds" id="SelectedServiceIds" placeholder="Choose Service">
            <option>Choose Service</option>
        </select>
    </div>
</div>

Answer 1

一种方法，只需在循环之前添加此选项（您也可以从html中删除它）

if (data[0]) {
  //Remove all options
  $("#SelectedServiceIds").html("");

  //Add the static option
  $("#SelectedServiceIds").append(
    $("<option></option>").attr("value", -1).text("Choose Service")
  );

  //Add the dynamic options
  $.each(data, function(key, value) {
    $("#SelectedServiceIds").append(
      $("<option></option>")
        .attr("value", value.ServiceID)
        .text(value.ServiceName)
    );
  });
}

Answer 2

if (data[0]) {
                $('#SelectedServiceIds').html("");
$('#SelectedServiceIds').append('<option value="0" selected="selected">Choose Service</option>');
                 $.each(data, function (key, value) {
                 $('#SelectedServiceIds').append(
                 $("<option></option>").attr("value", value.ServiceID).text(value.ServiceName));
                            });

                    }

Answer 3

可以在下面添加文字

if (data[0]) {
                $('#SelectedServiceIds').html("");

                 $.each(data, function (key, value) {
                 $('#SelectedServiceIds').append(
                 $("<option></option>").attr("value", value.ServiceID).text(value.ServiceName));
                            });

$("#SelectedServiceIds").prepend($("<option></option>").attr("value", -1).text("Choose Service").attr("selected",true));

                    }

Answer 4

只需在循环开始之前添加一个空选项，如下所示：

if (data[0]) {
    $('#SelectedServiceIds').html("<option value=''>Choose Service</option>");
    $.each(data, function (key, value) {
        $('#SelectedServiceIds').append(
            $("<option></option>").attr("value", value.ServiceID).text(value.ServiceName));
    });

}

应该如何在jQuery的动态下拉列表中添加静态选项

4 个答案: