資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何使用 JavaScript 刪除下拉列表中的選項？
本教程將教我們如何使用 JavaScript 刪除下拉列表中的選項。通常，使用者沒有經常刪除下拉列表中任何選項的選項，但如果程式設計師提供了此選項，則這是可能的。
如果程式設計師想要提供刪除下拉選單的選項，那麼在 JavaScript 中，可以使用remove()方法實現。使用 DOM，使用者可以選擇要刪除的選項，並透過提供一個函式將其傳遞給 remove 方法，該方法將刪除它。讓我們詳細瞭解並理解整個過程。
語法
remove() 方法的語法如下：
var element = document.getElementById( "selectNow" ); element.remove( element.selectedIndex );
在上面的語法中，“selectNow” 是定義選項的下拉列表的 ID。我們使用了 DOM 的 ‘getElementById’ 方法來獲取下拉列表並將該列表儲存在一個變數中。
之後，使用函式remove()，我們透過將其作為 remove() 函式的引數來刪除 ‘selectedIndex’ 元素。此外，‘selectedIndex’ 將返回我們想要刪除的選項，我們必須先選擇它才能刪除它。
注意 - ‘selectedIndex’ 是預定義的方法，它將返回使用者選擇的索引值。
演算法
我們已經看到了從列表中刪除選項的語法，讓我們一步一步地檢視完整的演算法，以便更好地理解它：
建立表單或下拉選單
在這些步驟中，我們將建立一個表單，在其中我們將定義或建立下拉選單和一個按鈕，該按鈕將呼叫函式以從下拉列表中刪除物件。
首先，我們必須使用 <form> 標籤建立一個表單，其中將包含我們的下拉列表。
我們將使用 <select> 標籤建立一個列表，並賦予其一些 ‘id’ 以便於引用。
在 <select> 標籤下，我們將使用 <option> 標籤來定義列表的元素。
在表單中，定義 ‘options’ 後，我們將使用 <input> 標籤定義一個輸入欄位，並將其型別設定為按鈕，我們將定義 ‘onclick’ 事件，該事件將呼叫我們稍後將在指令碼中定義的函式。
定義刪除指令碼或函式
在這些步驟中，我們將定義將在上面定義的按鈕的 ‘onclick’ 事件中呼叫的函式。
首先，我們將使用 ‘function’ 關鍵字建立一個函式，併為其命名，該名稱將在 ‘onclick’ 事件中呼叫。
在定義的函式中，我們將建立一個變數來儲存從對 ‘document.getElementById()’ 方法的呼叫中返回的值。
我們將上面定義的下拉列表的 ‘id’ 作為引數傳遞給對 ‘document.getElementById()’ 方法的呼叫。
透過使用帶變數（包含對該方法的呼叫的返回值）的 remove 方法並使用 ‘selectedIndex’ 方法傳遞引數來刪除選項，我們將刪除所需的選項。
這些是從下拉選單中刪除選項的基本步驟，現在讓我們看一些示例，以便更好地理解上面定義的步驟。
示例
在這個例子中，我們將逐步實現上面定義的演算法來刪除給定下拉選單的元素，讓我們實現程式碼：
<!DOCTYPE html> <html> <body> <p>Select any option and click the button to remove the selected option.</p> <form id = "myForm"> <select id = "id_dropdown"> <option>One</option> <option>Two</option> <option>Three</option> </select> <input type = "button" onclick = "fun_remove()" value = "Click to Remove"> </form> <script> function fun_remove() { var element = document.getElementById("id_dropdown"); element.remove(element.selectedIndex); } </script> </body> </html>
在上面的輸出中，我們得到一個下拉列表和一個按鈕來刪除選定的元素。透過單擊“單擊以刪除”按鈕，我們可以刪除列表中可見或選定的元素。
結論
在本文中，我們學習了從下拉選單中刪除選項的方法。只有在定義下拉選單時，程式設計師為使用者定義或建立了刪除選項的按鈕，才有可能實現此功能。要刪除任何選項，使用者必須選擇它，然後使用 remove() 函式並透過 ‘getElementById’ 和 ‘selectedIndex’ 方法獲取元素，使用者就可以刪除它。
12K+ 次瀏覽
