JavaScript:在新的Option()之后添加额外的属性

Question

我有一段代码,根据一些其他标准动态地向选择字段添加选项.看起来有点像这样:

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框架的情况下做到这一点.它只是我需要的这一小部分代码,因此框架对于这个项目来说是过度的.

干杯! :-)

Answer 1

你可以做点什么

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

Answer 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);

Answer 3

您可以将其合并到一行代码中：

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

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