JavaScript新增和刪除select下拉項
select下拉選單在網頁中非常的常用,有時需要根據特定情況,對select下拉選單進行動態的操作。
下面就簡單介紹一下相關內容,希望能夠給大家帶來一定的幫助。
一.動態建立一個select下拉選單:
[JavaScript] 純文字檢視 複製程式碼var theSelect=document.createElement("select"); theSelect.id="newId"; document.body.appendChild(theSelect);
以上程式碼建立了一個select下拉選單物件,並且設定id屬性值。
二.為下拉選單新增option選項:
[JavaScript] 純文字檢視 複製程式碼//theSelect.add(new Option("文字","值")); //在IE中有效 theSelect.options.add(new Option("text","value")); //相容所有主流瀏覽器
以上程式碼可以為select下拉選單新增下拉選項,要注意瀏覽器相容性問題。
三.刪除一個option項:
[JavaScript] 純文字檢視 複製程式碼var index=theSelect.selectedIndex; theSelect.options.remove(index);
以上程式碼可以刪除當前被選項。remove()的引數可以是任意選項的索引,索引值從0開始的。
四.刪除所有選項:
[JavaScript] 純文字檢視 複製程式碼theSelect.options.length=0;
將選項的的長度設定為0即可。
相關文章
- JavaScript動態新增和刪除div元素JavaScript
- JavaScript table表格行進行刪除和新增JavaScript
- JavaScript 陣列新增或者刪除元素JavaScript陣列
- JavaScript 動態新增與刪除元素JavaScript
- jQuery 新增和刪除classjQuery
- JavaScript動態新增或者刪除HTML元素JavaScriptHTML
- JavaScript動態操作select下拉選單JavaScript
- JavaScript刪除元素節點程式碼例項JavaScript
- mysql-刪除和新增主鍵MySql
- jQuery為元素新增和刪除classjQuery
- MySQL 8.0 instant 新增和刪除列MySql
- windows 新增和刪除靜態路由Windows路由
- antd Select下拉項資料過多,偶現下拉皮膚空白
- 迴圈方式為select下拉選單新增年份
- JavaScript刪除和清空物件屬性JavaScript物件
- jQuery動態新增和刪除表格行jQuery
- jQuery table表格行的新增和刪除jQuery
- 如何在下拉框Select中動態新增option?
- JavaScript 刪除cookieJavaScriptCookie
- 新增、刪除PPA源
- ubuntu 快捷新增和刪除環境變數Ubuntu變數
- jQuery動態新增和刪除表格記錄jQuery
- 一體機HDATA節點新增和刪除
- SRVCTL 刪除和新增資料庫服務資料庫
- JavaScript新增一個文字框並帶有刪除按鈕JavaScript
- 設定select下拉選單的預設選中項
- Js/JQuery下拉框新增新選項JSjQuery
- 紅黑樹新增刪除
- excel下拉選擇項怎麼設定 excel怎麼新增下拉選項內容Excel
- classList用於新增和刪除CSS類的APICSSAPI
- vue實現li列表的新增刪除和修改Vue
- Hyperledger Fabric組織的動態新增和刪除
- Hyperledger Fabric節點的動態新增和刪除
- select 下拉框用 Select select = new Select (element) 方法失敗
- win10如何新增和刪除輸入法 win10系統新增和刪除輸入法的圖文教程Win10
- HTML select 下拉選單HTML
- HTML select下拉選單HTML
- mysql 刪除重複項MySql