javascript - 在下拉列表中设置选项值

Question

我正在尝试在下拉/选择中设置一个选项。我以前曾这样做过，但由于某种原因我收到了错误，但我不确定为什么。

代码

var _loc = {
        ALL_BUYS: [{ Text: "All Buys", Value: "AAA"}],
        NETWORK_BREAK: [{ Text: "Network Break", Value: "NTN"}],
        SYNDICATED_BREAK: [{ Text: "Syndicated Break", Value: "STA"}],
        LOCAL_BREAK: [{ Text: "Local Break", Value: "LTA"}],
        NATIONAL_LOCAL: [{ Text: "National/Local", Value: "LTN"}],
        LOCAL_LOCAL: [{ Text: "Local/Local", Value: "LTL"}]//,
    };

lstOptions = $("<select></select>");

$.each(_loc, function (i, item)
    {
        $("<option></option>")
            .appendTo(lstOptions)
            .html(item.Text)
            .val(item.Value) // receive error: Object  has no method 'val'
        });

Answer 1

您没有正确从对象中获取值。

格式如下:

{key1:[{0, 1}], key2:[{0, 1}], key3:[{0, 1}]}

当您使用$.each时，它会选择以下状态中的每一个:

[{0, 1}]

在第一次迭代中，它将选择与 key1 关联的值，在第二次迭代中，它将选择与 key2 关联的值，等等。

由于每个键的值中都嵌套有数组，因此您需要指定它在匹配值中查找第一个数组:

var _loc = {
    ALL_BUYS: [{ Text: "All Buys", Value: "AAA"}],
    NETWORK_BREAK: [{ Text: "Network Break", Value: "NTN"}],
    SYNDICATED_BREAK: [{ Text: "Syndicated Break", Value: "STA"}],
    LOCAL_BREAK: [{ Text: "Local Break", Value: "LTA"}],
    NATIONAL_LOCAL: [{ Text: "National/Local", Value: "LTN"}],
    LOCAL_LOCAL: [{ Text: "Local/Local", Value: "LTL"}]
};

lstOptions = $("select");

$.each(_loc, function(i, item){
    $("<option></option>")
        .appendTo(lstOptions)
        .html(item[0].Text)
        .attr("value", item[0].Value);
});​

Demo .

注意item[0]。其作用是选择其抓取的值中索引为 0 的数组。由于只有一个，因此该单个数组的索引为 0，因此它选择该特定数组。然后您找到并设置其文本和值。

另请注意，我将 val() 更改为 attr()，因为 option 元素不支持 val() (但是，您可以在 select 元素上使用它来设置其值等于此函数中指定的值的选项以使其被选中)。

提示:您还可以删除每个嵌套对象周围的文字数组指示符并使用原始方法。 Demo .