JavaScript select size 屬性

admin發表於2018-10-17
JavaScript

此屬性可以設定或返回下拉選單中的可見選項數目，可讀寫屬性。

語法結構:

[JavaScript] 純文字檢視 複製程式碼
select.size

瀏覽器相容:

（1）.IE瀏覽器支援此屬性。

（2）.edge瀏覽器支援此屬性。

（3）.谷歌瀏覽器支援此屬性。

（4）.火狐瀏覽器支援此屬性。

（5）.Opera瀏覽器支援此屬性。

（6）.Safari瀏覽器支援此屬性。

程式碼例項如下： 

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title> 
<script type="text/javascript"> 
window.onload=function(){ 
  var oselect=document.getElementById("myselect"); 
  var odiv=document.getElementById("ant");
  odiv.innerHTML=oselect.size;
} 
</script> 
</head> 
<body> 
<select id="myselect" name="myselect" size="2"> 
  <option value="1">螞蟻部落</option> 
  <option value="2">div+css專區</option> 
  <option value="3">ASP專區</option> 
  <option value="4">螞蟻部落二</option> 
</select> 
<div id="ant"></div>
</body> 
</html>

由於select設定size屬性值為2，所以select物件的size屬性值返回值也是2。

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title> 
<script type="text/javascript"> 
window.onload=function(){ 
  var oselect=document.getElementById("myselect"); 
  oselect.size=3;
} 
</script> 
</head> 
<body> 
<select id="myselect" name="myselect"> 
  <option value="1">螞蟻部落</option> 
  <option value="2">div+css專區</option> 
  <option value="3">ASP專區</option> 
  <option value="4">螞蟻部落二</option> 
</select> 
</body> 
</html>

動態設定select下拉選單可見專案數為3。

相關文章