Javascript：將元素值設置爲集合

Question

我有一個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 

編輯：我編輯了，但沒有按沒有用。

Answer 1

獲取所有選擇，通過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爲選擇的值的數組。

Answer 2

您可以添加一個隱藏的表單參數說與名稱「allValues」，並在發佈表單之前使用JavaScript，您可以添加該參數中的所有選擇值。