select多選 multiple的使用示例

2024-05-06 16:09:03

字體：大中小

供稿：網(wǎng)友

使用multiple可以實(shí)現(xiàn)select多選，本例將為大家介紹下select多選 multiple的使用，新手朋友們可以學(xué)習(xí)下

復(fù)制代碼代碼如下:

<html>
<head>
<script type="text/javascript">
function showDiv(id){

document.getElementById("selectOption").style.display="block";
document.getElementById("selectOption").style.position="absolute";
document.getElementById("selectOption").style.top=document.getElementById(id).offsetTop+25;
document.getElementById("selectOption").style.left=document.getElementById(id).offsetLeft+20;
}
function selectM()
{
var obj = document.getElementById("mySelect");
alert(obj.selectedIndex);

}
function checkselect(objname){
o = document.getElementById(objname);
t = document.getElementById("output");
var intvalue="";
for(i=0;i<o.length;i++){
if(o.options[i].selected){
intvalue+=o.options[i].value+",";
}
}
t.value=intvalue.substr(0,intvalue.length-1);
alert(intvalue);

}

</script>
</head>
<body>

<form>
<div>
<select multiple="multiple" size="4">
<option value='蘋果'>蘋果</option>
<option value='桃子'>桃子</option>
<option value='香蕉'>香蕉</option>
<option value='桔子'>桔子</option>
</select>
<input type="button" value="checkselect">
</div>
選中的項(xiàng)目：<input type="text">
<input type="button" value="選擇">
<br/>
</form>
<p>在您點(diǎn)擊 “選擇多個(gè)” 按鈕之前，請(qǐng)嘗試同時(shí)選取多個(gè)選項(xiàng)。在點(diǎn)擊 “選擇多個(gè)” 按鈕之后，請(qǐng)?jiān)僭囈淮巍?lt;/p>
</form>
</body>
</html>