将多个元素放入 Select 选项

Question

我有一个函数可以创建下拉选项并过滤掉重复项（它还使用 class 名称根据在另一个下拉列表中选择的状态进行额外过滤）。但是，选项只有文本和 classes，我正在努力包括值，这些值需要与文本相同，但引号和撇号用 .replace(/"|'| /g,'')。感谢您的帮助。

var stateValues = [];
var viewValues = [];
var stateView = {};
$("div.info").each(function(index, elem) {
    stateValues.push($(this).attr("data-state"));
    viewValues.push($(this).attr("data-view"));
    stateView[$(this).attr("data-view")] = $(this).attr(
        "data-state");
});
var viewUnique = [];
$(viewValues).each(function(index, item) {
    if ($.inArray(item, viewUnique) == -1) viewUnique.push(item);
});
$(viewUnique).each(function(index, item) {
    $("#view").append($("<option class='" + stateView[item] +
        "'>").html(item));
});

Answer 1

你的问题基本上已经有了答案。在您的最后一段代码中：

$(viewUnique).each(function(index, item) {
    $("#view").append($("<option class='" + stateView[item] + "'>").html(item));
});

您已经在创建具有 class 名称和项目文本的元素。你甚至知道用正则表达式去掉引号！您只需要对 class 做与 value:

类似的事情

$(viewUnique).each(function(index, item) {
    $("#view").append($("<option class='" + stateView[item] + "' value='" + item.replace(/"|'|/g,'') + "'>").html(item));
});

Answer 2

最简单和最好的方法是使用 jQuery 添加 class 的本机函数，因为它永远不会添加错误。

$("#view").append($("<option></option>").addClass("stateView[item]").text(item));

它将确保您无需对任何内容进行编码，jQuery 会为您处理。

您还可以通过 $("<option></option>").attr("value", item).addClass("stateView[item]"))

之类的操作来添加属性和任何您想要的内容

将多个元素放入 Select 选项

Put Multiple Elements Into Select Options

jquery

options