使用 JavaScript 在文字區域中強制執行字元限制

使用 HTML 表單時，限制使用者可以在文字區域中輸入的字元數通常至關重要。雖然 元素提供了 maxlength 屬性，但它並不總是實現此功能的最方便方法。

使用 JavaScript 模擬 maxlength

JavaScript 可以用來達到相同的效果。一種方法是使用 onkeypress 和 onkeyup 等事件處理程序來監控文字區域值的長度並相應地限制輸入。但是，此方法需要為每個文字區域重複事件處理程式碼。

自動長度強制

要自動執行字元限制的過程，更優雅的解決方案是使用 JavaScript 程式碼來計算每個文字區域元素的 maxlength 屬性是動態的。此方法涉及以下步驟：

1. 識別文字區域：使用 document.getElementsByTagName('TEXTAREA') 擷取文件中所有文字區域的清單。
2. 檢查 maxlength 屬性：對於每個文字區域，檢查其是否具有有效值（大於 0 的數字）的 maxlength 屬性。
3. 建立匿名函數：定義一個匿名函數來驗證文字區域的長度，並在超出限制時顯示警報。
4. 指派事件處理程序：將匿名函式指派為 onkeyup 和 onblur 事件文字區域的處理程序。每當使用者鍵入或退出文字區域時，這些事件就會觸發，從而提示長度驗證。

問題中提供的程式碼範例示範了這種方法，自動為文件中的所有文字區域強制執行 maxlength 屬性。透過採用這種技術，開發人員可以強制執行字元限制，而無需重複的事件處理程式碼。