Javascript：将元素值设置为集合答案

【问题标题】：Javascript: Form element values to a CollectionJavascript：将元素值设置为集合
【发布时间】：2014-12-23 14:42:01
【问题描述】：

我有一个 HTML 页面，其中选择元素的数量不断变化。

    <script>
    function getValues() {
        var selects = document.getElementsByTagName('select'),
        arr = Array.prototype.slice.call(selects),
        selectValues = arr.map(function (select) {
            return select.value;
    });
        return selectValues;
    }
    </script>

<script type='text/javascript'>
    function moreSelect() {
    for (i = 0; i < number; i++) {
        // Append a node with a random text
        container.appendChild(document.createTextNode("Name " + (i+1) + ": "));
        // Create an <input> element, set its type and name attributes
        var input = document.createElement("select");
        input.name = "name" + (i+1);
        container.appendChild(input);
        // Append a line break 
        container.appendChild(document.createElement("br"));
    }
</script>

<form action="action"method="POST" onsubmit="return getValues;">

                    More selects (max. 9):<br>
                <p>
                    <input type="number" id="name" name="name" value="0"
                        min="0" max="9"><br />
                    <button type="button" onclick="moreSelect()">Add</button>
                    <br>
                <p>
                    <br>
                <div id="container" /></div>

                <p>
                    <br> <br> <input type="submit" value="Go">
            </form>

我想在 POST 方法之前将此值收集到列表或数组中，并将此参数列表提供给我的 Java 控制器，如下所示：

@RequestParam("allValues") List<String> allValues

编辑：我编辑了它，但不起作用。

【问题讨论】：

您只想要每个选择的值还是它们的名称？顺便说一句：您的选择中没有选项？
只是价值观。是的，我知道，我跳过这部分。 :)

标签： java javascript html forms

【解决方案1】：

您可以添加一个名为“allValues”的隐藏表单参数，并在发布表单之前使用javascript，您可以在该参数中添加所有选择值。

【讨论】：

好的，但是我该怎么做呢？
您可以在提交表单之前调用函数，例如
在这个函数中，您实际上可以 getEelementById 并遍历值

【解决方案2】：

获取所有选择，通过Array.prototype.slice 将它们转换为真正的数组。现在您可以使用map 获取所有值。 getElementsByTagName返回一个HTMLCollection，不支持map()等

var selects = document.getElementsByTagName('select'),
    arr = Array.prototype.slice.call(selects),
    selectValues = arr.map(function (select) {
        return select.value;
    });

现在selectValues 是一个选择值的数组。

【讨论】：