3

与Select 标签中的选项可以携带多个值类似的问题吗?- 除了我想引用 JavaScript 中的值

回顾一下:
我想为选择框中的选定项目返回多个值 - 所以我在想这样的事情:

<SELECT id='selectList'>
   <OPTION value1="a" value2="b" value3="c">OPTION 1</OPTION>
   <OPTION value1="d" value2="e" value3="f">OPTION 2</OPTION>
</SELECT>

然后我想获取所选项目的值:

var sel = document.getElementById('selectList');
selValue1 = sel.options(sel.selectedIndex).value1;
selValue2 = sel.options(sel.selectedIndex).value2;
selValue3 = sel.options(sel.selectedIndex).value3;

目前我可以为一个选项提取 value='x' 但我需要更多的值与该选项相关联。我可能可以将所有三个值分隔为一个,然后使用字符串函数将它们分开,但这看起来很讨厌。

4

3 回答 3

3

我认为您正在寻找attributes属性:

var sel = document.getElementById('selectList');

selValue1 = sel.options[sel.selectedIndex].attributes.value1.value;

这是一个jsFiddle 演示如何提取这些值

于 2013-05-04T11:37:32.027 回答
0

无法理解其中的原因。当然,您可以使用自定义数据属性,如https://developer.mozilla.org/en-US/docs/HTML/Global_attributes#attr-data- * 或简单的旧 get/setAttribute()。

一个更好的解决方案是,制作一个像

var optionValues={ option1: [a,b,c], option2 [d,e,f] }

所以数组的分辨率很容易:

var values=optionValues[selectedOption];

所以不需要在 DOM 中存储额外的数据。

于 2013-05-04T11:36:35.307 回答
0

我会将所有值放在 JS 中的对象数组中,并将该数组的每个位置作为 SELECT 元素中的 OPTIONS 的值。

所以,我的 SELECT 会是这样的(值 = 数组的索引位置):

<SELECT id='selectList'>
   <OPTION value="0">OPTION 1</OPTION>
   <OPTION value="1">OPTION 2</OPTION>
</SELECT>

还有一个数组的例子:

var array = [
          { 
            "value1": "a",
            "value2": "b",
            "value3": "c"
          },
          { 
            "value1": "d",
            "value2": "e",
            "value3": "f"
          }
      ];

array[0]
Object {value1: "a", value2: "b", value3: "c"}
array[1]
Object {value1: "d", value2: "e", value3: "f"}

以及如何获得每个对象:

var sel = document.getElementById('selectList');
var selectedValue = sel.options[e.selectedIndex].value;

When selected value is first option (value = 0):

array[selectedValue]
Object {value1: "a", value2: "b", value3: "c"}

array[selectedValue].value1
"a"
array[selectedValue].value2
"b"

When selected value is first option (value = 1):

array[selectedValue].value1 
"d"
array[selectedValue].value2
"e"

等等...

于 2013-05-04T11:54:34.727 回答