无法从下拉菜单(Javascript)中的选定选项获取数组

时间:2019-01-31 10:30:37

标签: javascript

当我在下拉菜单中选择一个选项时,我希望它显示其值。问题在于每个可用选项的值都是Flask的值列表。例如:'{{column1}}'的值-不带双引号-“ ['abc','def','ghi']”。因此,当我选择一个选项时,它仅返回列表的第一项。例如(不带双引号):“ ['abc',”。

是否有任何变通方法来返回值的完整列表?

<script>
    function showOptions(s) {
    alert(s[s.selectedIndex].value);
    alert(s[s.selectedIndex].id);
    }
</script>

<select  onchange="showOptions(this)" id="my_select2">
    <option value={{ column1 }} id={{ column1 }}>{{ label_a1 }}</option>
    <option value={{ column2 }} id={{ column2 }}>{{ label_b1 }}</option>
</select>

1 个答案:

答案 0 :(得分:0)

您要更改每个value={{ column1 }} id={{ column1 }}周围用{{ ... }}括起来的双引号

来自

value={{ column1 }} id={{ column1 }}

收件人

value="{{ column1 }}" id="{{ column1 }}"

否则,您的值将完全像这样:value=['abc', 'def', 'ghi'],这意味着value=['abc',(空格结束分配的值,因为没有双引号来分隔它们)

换句话说,来自

function showOptions(s) {
    alert(s[s.selectedIndex].value);
    alert(s[s.selectedIndex].id);
    }
<select  onchange="showOptions(this)" id="my_select2">
    <option value=['abc', 'def', 'ghi'] id=['abc', 'def', 'ghi']>{{ label_a1 }}</option>
<!--        ^-----------^------ This is your value attribute  -->
    <option value=['jkl', 'mno', 'pqr'] id=['jkl', 'mno', 'pqr']>{{ label_b1 }}</option>
</select>

收件人

function showOptions(s) {
    alert(s[s.selectedIndex].value);
    alert(s[s.selectedIndex].id);
    }
<select  onchange="showOptions(this)" id="my_select2">
    <option value="['abc', 'def', 'ghi']" id="['abc', 'def', 'ghi']">{{ label_a1 }}</option>
<!--        ^---------------------------^------ This is the value attribute you want -->
    <option value="['jkl', 'mno', 'pqr']" id="['jkl', 'mno', 'pqr']">{{ label_b1 }}</option>
</select>