1. 程式人生 > >select標籤設定multiple屬性,如何獲取值

select標籤設定multiple屬性,如何獲取值

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" }
?>