Javascript 默认选择一个选项

Question

当用户单击某个项目时，我会出现以下选择下拉菜单:

        $(this).html($("<select/>", {
          class: 'sel',
        }).append($("<option/>", { text: "WIP" }))
          .append($("<option/>", { text: "C" }))
          .append($("<option/>", { text: "A" }))
          .append($("<option/>", { text: "AR" }))
          .append($("<option/>", { text: "NS" }))
        );

此外，我还有一个名为 status 的变量，它被定义为“WIP”、“C”、“A”、“AR”或“NS”。

status = trim(($(this).text()));

我希望当我单击select下拉列表时，option == status将被选中。例如:

status = "WIP"
<select class="sel">
     <option selected="selected">WIP</option>
     <option>C</option>
     ...
</select>        

Answer 1

根据我对问题的理解，您需要设置一个默认选项，以便在用户单击之前选择一个选项。

具体操作方法如下:

var status = "WIP";

$("<select/>", {
    class: 'sel',
})
.append( $("<option/>", { text: "WIP" }) )
.append( $("<option/>", { text: "C" }) )
.append( $("<option/>", { text: "A" }) )
.append( $("<option/>", { text: "AR" }) )
.append( $("<option/>", { text: "NS" }) )
.val( status )
.appendTo(this);

请注意，整个 select 元素应在将其附加到 DOM 之前构建。这对于性能来说要好得多，因为与 DOM 的任何交互都非常昂贵。