select標籤設定multiple屬性,如何獲取值
阿新 • • 發佈:2019-02-18
select標籤通過設定multiple屬性和size屬性,就可以實現多選,且從下拉框變成了列表框。
然而 用form提交時只能得到最後一個被選中的,然後我就臨時記錄了這點程式碼,
可能對我或者他人有點作用
上程式碼 text.html:
<form action="post.php" method="post"> 選擇年份<br> <select id="years" name="years"> <option value="2017"> 2017</option> <option value="v2018">2018</option> </select> <br> 選擇喜歡的月份<br> <select id="month" name="month" multiple="multiple" size="12" onchange ="changeMonth()"> <optgroup label="月份"> <option value="1"> 1</option> <option value="2"> 2</option> <option value="3"> 3</option> <option value="4"> 4</option> <option value="5"> 5</option> <option value="6"> 6</option> <option value="7"> 7</option> <option value="8"> 8</option> <option value="9"> 9</option> <option value="10"> 10</option> <option value="11"> 11</option> <option value="12"> 12</option> </optgroup> </select> <br> <input type="hidden" name="selectMonth" id="selectMonth" value=""> <button type="submit"><b>提交</b></button><br /> </form> <script type="text/javascript"> function changeMonth() { var month=[]; var obj = document.getElementById("month"); for(var i=0;i<obj.options.length;i++){ if(obj.options[i].selected){ month.push(obj.options[i].value);// 收集選中項 } } var selectMonth = document.getElementById("selectMonth"); console.log(selectMonth); selectMonth.value = month; } </script>
點選提交時 post.php
<?php
var_dump($_POST);
//array(3) { ["years"]=> string(4) "2017" ["month"]=> string(1) "4" ["selectMonth"]=> string(3) "3,4" }
?>