JavaScript：在 new Option() 之后添加额外的属性答案

【问题标题】：JavaScript: add extra attribute after new Option()JavaScript：在 new Option() 之后添加额外的属性
【发布时间】：2011-03-31 11:23:16
【问题描述】：

我有一段代码可以根据其他一些条件动态地将选项添加到选择字段。它看起来有点像这样：

if (chosen == "a_value") {
  selbox.options[selbox.options.length] = new Option('text_1','value_1');
  selbox.options[selbox.options.length] = new Option('text_2','value_2');
  selbox.options[selbox.options.length] = new Option('text_3','value_3');
}

我需要为包含特定值的新选项添加一个额外的属性。在这种情况下，该属性将被称为“折扣”并且值将是一个整数。稍后我将读取属性值并根据 Option 字段中的值进行处理。

因此，一旦脚本准备就绪，选项将如下所示；

<option value="value_1" discount="integer">text_1</option>

有道理吗？

现在我如何在不使用 JS 框架的情况下做到这一点。这只是我需要的一小部分代码，所以对于这个项目来说，一个框架可能是多余的。

干杯！ :-)

【问题讨论】：

标签： javascript attributes option

【解决方案1】：

你可以做类似的事情


var o1 = new Option("key","value");
selbox.options[selbox.options.length] = o1;
o1.setAttribute("key","value");

【讨论】：

或者只添加这一行：selbox.options[selbox.options.length].setAttribute("discount", "integer");

【解决方案2】：

我知道这是旧的，但是当我忘记它是 add 而不是今天的 push 时，我遇到了这个问题。

正确的方法是使用select.options.add。

 var opt = document.createElement('option');
 opt.value = 'hello';
 opt.text = 'world';
 opt.setAttribute('data-discount', 'integer');
 selbox.options.add(opt);

【讨论】：

【解决方案3】：

你可以把它组合成一行代码：

(selbox.options[selbox.options.length] = new Option("key","value")).setAttribute("key","value");

请注意，这仅在您只有一个要添加的属性时才有效，否则您将需要一个临时变量。

【讨论】：