如何使用 JavaScript 來禁用按鈕
了解如何使用 JavaScript 以程式化的方式禁用或啟用按鈕
HTML 的按鈕元素是少數具有獨立狀態的元素之一。與幾乎所有的表單控件一起使用。
其中一個常見需求是使用 JavaScript 以程式化的方式禁用或啟用按鈕。
例如,您希望僅在文字輸入元素填寫時才啟用按鈕。
或者當特定的複選框被點擊時,例如那些用於表示“已閱讀條款和條件”的複選框,而實際上沒有人會閱讀。
以下是具體操作步驟:
首先,使用document.querySelector()
或 document.getElementById()
選取元素:
1 | const button = document.querySelector('button') |
如果您有多個按鈕,您可能需要使用document.querySelectorAll()
並循環遍歷結果。
無論如何,一旦您有元素引用,您可以將其 disabled
屬性設置為 true
以禁用按鈕:
1 | button.disabled = true |
若要重新啟用按鈕,則將其設置為 false
即可:
1 | button.disabled = false |
tags: [“JavaScript”, “HTML”, “button”, “disable”, “enable”]