如何使用Javascript / jQuery設置下拉列表的選項？

Question

有誰知道如何使用javascript或jquery設置下拉菜單的選項和值？ 我正在使用這個HTML：

<select size="1" id="D1">
</select>

謝謝您的幫助。

Answer 1

你甚至不一定需要jQuery：

var select = document.getElementById("D1"),
    opt = document.createElement("option");
opt.value = "value";
opt.textContent = "text to be displayed";
select.appendChild(opt);

例子 。

但無論如何這里是jQuery：

$("select#D1").append( $("<option>")
    .val("value")
    .html("text to be displayed")
);

例子 。

Answer 2

另一種方法是使用select的add方法 ：

var select = $("#select")[0];

select.add(new Option("one", 1));
select.add(new Option("two", 2));
select.add(new Option("three", 3));

示例： http ： //jsfiddle.net/pc9Dz/

或者另一種方式，通過直接為select的options集合分配值：

var select = $("#select")[0];

select.options[0] = new Option("one", 1);
select.options[1] = new Option("two", 2);

Answer 3

這是通過使用options數組使用javascript（類似於Andrew Whitaker的答案）刪除選項的另一種方法：

var select = document.getElementById("D1");
select.options.length = 0;//remove all options

Answer 4

有幾種不同的方式。 一個是：

$("#D1").append("<option>Fred</option>");

Answer 5

$("#dropdown").html("<option value='val1'>label 1</option><option value='val2' selected='selected'>label 2</option>");