刪除下拉列表中的選項
阿新 • • 發佈:2019-01-24
一 介紹
刪除下拉列表中的單個選項可以用select物件的remove()、focus()方法和selectedIndex屬性來實現。
1、remove()方法
該方法用於在下拉列表中刪除指定的option物件。
myselect.remove(index)
myselect:當前要刪除選項的select物件的名稱。
index:要刪除的option物件的下標。
例如,刪除myselect下拉列表中的第2個選項。程式碼如下:
myselect.remove(1)
2、focus ()方法
該方法將焦點移到當前物件上。
myselect.focus()
3、selectedIndex屬性
該屬性用於獲取select物件中當前被選中的option物件的下標。
n=myselect.selectedIndex
n:儲存當前被選中的option物件的下標值。當沒有選中option物件時,該屬性的值為-1。
二 應用
本應用自動在滾動列表中選中第一個選項,然後單擊“刪除”按鈕將其刪除,使用者也可以通過滑鼠選中指定的選項進行刪除。
三 程式碼
四 執行效果
<form name="form1" method="post" action=""> <select style="width:100px " name="select1" size="4" multiple> <option value="1">第一</option> <option value="2">第二</option> <option value="3">第三</option> <option value="4">第四</option> </select> <input type="button" name="Button" value="刪除" onclick="selectDelete(document.form1.select1,this)"> </form> <script language="javascript"> <!-- function selectDelete(sname,bname) //該方法用於刪除當前被選中的選項 { if (sname.length>0) { if (sname.selectedIndex>=0) sname.remove(sname.selectedIndex); if (sname.length==0) bname.disabled=true; } selectfocus(document.form1.select1); } function selectfocus(sname) //該方法用於選中select物件中的第一個選項 { if (sname.length>0) { sname.focus(); sname.options[0].selected=true; //使滾動列表中的第一個選項為選中狀態 } } selectfocus(document.form1.select1) //頁面載入後自動呼叫selectfocus()方法 //--> </script>