Javascript

Question

我有一个表单，用户可以根据需要添加任意数量的下拉菜单。我需要将下拉菜单中所选选项的文本保存到会话中。

HTML:

<select name="codes[]" class="form-control-edited coinsurers-sv d-inline-block" placeholder="Please select">
    <option value="">Please select</option>
    <option value="1">Test 1</option>
    <option value="2">Test 2</option>
    <option value="3">Test 3</option>
</select>

Javascript:

<script>
let coInsuredPersonsSV = $('.coinsurers-sv').map(function (){ return $('.coinsurers-sv').find("option:selected").text() }).toArray();
sessionStorage.removeItem('co-insured-persons-hi-sv');

if (coInsuredPersonsSV.length > 0) {
sessionStorage.setItem('co-insured-persons-hi-sv', JSON.stringify(coInsuredPersonsSV));
}
</script>

现在假设用户需要 3 个下拉表单并在每个下拉字段上选择另一个选项。

Dropdown 1: Test 1
Dropdown 2: Test 2
Dropdown 3: Test 3

我的会话存储的结果是：

["Test 1   Test 2   Test 3", "Test 1   Test 2   Test 3", "Test 1   Test 2   Test 3"]

但结果应该是：

["Test 1", "Test 2", "Test 3"]

有人可以帮助我了解如何更改 .find 函数以获得我想要的结果吗？

Answer 1

在 map 回调函数中，您 select all 下拉列表，而不是迭代列表。所以替换这段代码：

return $('.coinsurers-sv').find

...与：

return $(this).find

Javascript - 从多个 select 框中获取文本而不是值

Javascript - get text instead of values from multiple select boxes

jquery

session-storage