如何使用 JavaScript 從 HTML 輸入元素中刪除「停用」屬性？

在 HTML 中，我們可以使用輸入元素透過建立表單或以任何其他方式從使用者那裡取得輸入。輸入元素有不同類型，例如複選框、單選按鈕、文字、數字等。

我們可以對每個元素使用「disabled」屬性來停用輸入欄位並阻止使用者與輸入元素互動。在某些情況下，我們需要使用 JavaScript 來新增和刪除停用屬性。例如，我們想要取得年齡大於 18 歲的使用者的泛卡號。因此，我們要求透過從 JavaScript 中刪除停用屬性，僅當使用者輸入大於 18 歲的年齡時才啟用泛卡輸入欄位。

在這裡，我們將學習使用 JavaScript 從 HTML 輸入元素中刪除禁用屬性的各種方法。

使用removeAttribute()方法

在第一種方法中，我們將使用removeAttribute()方法來刪除已停用的屬性。它用於從 HTML 元素中刪除我們作為方法參數傳遞的任何屬性。

＃＃＃句法＃＃＃

使用者可以依照下列語法使用removeAttribute()方法從輸入元素中刪除「disabled」屬性。

雷雷

在上面的語法中，我們將屬性名稱「disabled」作為方法的參數傳遞。

＃＃＃例＃＃＃

在下面的範例中，我們在 HTML 部分定義了文字輸入欄位。每當使用者點擊該按鈕時，它都會呼叫removeDisabled()函數。

在 remvoeDisabled() 函數中，我們透過 id 存取輸入元素。之後，我們透過將輸入元素作為引用並傳遞「disabled」作為參數來執行removeAttribute()方法。

在輸出中，使用者可以觀察到他們在單擊按鈕之前無法與輸入元素交互，但在單擊按鈕後可以與輸入元素交互。

雷雷

修改「停用」屬性

在這個方法中，我們將修改「disabled」屬性的值，而不是從 HTML 元素中刪除「disabled」屬性。 “disabled”屬性採用布林值。停用屬性的預設值為“true”，但我們可以將其設為“false”，它的工作方式與我們從任何輸入元素中刪除“disabled”屬性相同。

＃＃＃句法＃＃＃

使用者可以依照下面的語法將disabled屬性的值修改為false。

雷雷

範例1

在下面的範例中，我們建立了多個文字輸入元素，預設會全部停用。在 JavaScript 中，我們存取所有輸入元素並使用 forEach() 方法對輸入的節點清單進行迭代。在forEach()方法內部，我們將每個輸入的disabled屬性的值修改為false。

在輸出中，使用者可以觀察到點擊按鈕後所有輸入元素都難以處理。

雷雷

範例2

在下面的範例中，我們建立了多個複選框輸入，並向所有核取方塊新增了停用屬性以停用它們。在removeDisable()函數中，我們存取所有複選框並修改每個複選框的“disabled”屬性。

雷雷

我們學會了使用 JavaScript 從輸入元素中刪除停用屬性。在第一種方法中，我們使用了removeAttribute()方法，該方法從輸入元素中刪除已停用的屬性。在第二個元素中，我們修改了停用屬性的值，而不是將其從 HTML 元素中刪除，但我們能夠實現啟用輸入元素的目標。

以上是如何使用 JavaScript 從 HTML 輸入元素中刪除「停用」屬性？的詳細內容。更多資訊請關注PHP中文網其他相關文章！