javascript - 使用 javascript 设置选择框值

Question

可能重复：
JavaScript - 用数组填充下拉列表

我有以下select盒子，

<select name="supplier" id="supplier"><option></option></select>

我想使用设置这个select框的值Javascript。Javascript变量可以是 a或Stringan Array。这意味着如果它是一个，那么框中String将只有一个选项。select如果它是一个数组，则该select框应包含多个options. 有人请帮我找到解决方案。提前致谢....

我试过了

document.getElementById('supplier').value="Option 1";

但它不工作

Answer 1

如果您要进行大量 DOM 操作，我建议您使用jQuery ：

$("#supplier").append('<option value=1>My option</option>');

没有 jQuery：

var select = document.getElementById("supplier");
select.options[select.options.length] = new Option('Text 1', 'Value1');

Answer 2

试试这个：

http://jsfiddle.net/f4yEt/

function addOptions(input) {
    var sel = document.getElementById("supplier");
    if (typeof input === "string") {
        input = [input];
    }
    sel.options.length = 0;
    for (var i = 0; i < input.length; i++) {
        sel.options[sel.options.length] = new Option(input[i], input[i]);
        // This APPENDS options
    }
}

该input参数可以是字符串或数组（从技术上讲，它只检查字符串，将其转换为数组以进行迭代），然后为数组中的每个项目动态附加一个选项。

Answer 3

为此，您需要在 .

var select = document.getElementById('supplier');
var option = document.createElement('option');
select.add(option);

这是一个更大的教程，它考虑了 IE/FF 的差异： http ://www.mredkj.com/tutorials/tutorial005.html

但

我会考虑为此使用jquery。Sujathan 的答案有 jquery。

Answer 4

数组的jQuery方法

var array = ["item 1", "item 2", "item 3"];
$.each(array, function(i, value) {
  $('#supplier').append($(document.createElement('option')).attr('value', i + 1).text(value));
});​

http://jsfiddle.net/NN8KS/

Answer 5

//var varOpt = "test";
var varOpt = new Array('test1', 'test2', 'test3');
var sel = document.getElementById('supplier');

if( typeof varOpt === 'string' ){
   sel.add(new Option(varOpt , varOpt));
} else {
    for(key in varOpt) {
        sel.add(new Option(varOpt[key], varOpt[key]));
    }
}