JavaScript/Forms

許多用戶都熟悉在網頁上填寫表單，然後點擊「提交」按鈕。JavaScript 至少有兩種方法可以改進這個過程：

JavaScript 可用於在將數據發送到伺服器之前對其進行檢查。
- JavaScript 可以預先驗證數據，在用戶填寫表單時，在用戶單擊「提交」按鈕之前立即捕獲常見錯誤並提出改進建議。
- JavaScript 可以將輸入的文本輸入文本區域並在頁面的單獨區域中預呈現它，因此人們可以在單擊「預覽」按鈕之前看到它是如何呈現和格式化的。^[1]^[2]^[3]
- JavaScript 可以提供輸入到文本區域的文本的實時字數或字符數。^[4]^[5]^[6]^[7]
有時，網站會進行僅涉及少量數據的「在線」計算並將結果返回給用戶。在這種情況下，JavaScript 可以攔截「提交」按鈕，在瀏覽器本地進行整個計算。用戶或多或少地立即獲得結果，而不是等待他輸入的數據被發送到伺服器，等待伺服器處理該數據，然後等待數據從伺服器返回。

許多人建議讓殘障人士和關閉 JavaScript 的人可以訪問所有內容。一種方法是從標準 HTML 表單開始，然後添加不顯眼的 JavaScript 以改善啟用 JavaScript 的用戶的用戶體驗。系統應該優雅地降級，保持所有內容可用（並在必要時驗證用戶數據），無論任何或所有 JavaScript 是否成功運行。

進一步閱讀

JavaScript/Working With Files mentions one use of HTML forms
HyperText Markup Language/Forms explains how to write "plain" forms without JavaScript.

參考文獻

↑ "How can I display the HTML content of a Text Area within a div as HTML content and not text?"
↑ Andrey Fedoseev. "jQuery plugin to add realtime preview panel to text areas, similar to StackOverflow edit interface"
↑ Guillaume DE LA RUE. "A Markdown live editor in JS".
↑ Sacha Schmid. JavaScript word count
↑ Drew Schrauf. "JavaScript Wordcount That Works".
↑ "JavaScript word-count for any given DOM element"
↑ Jake Rocheleau. "Building a Live Text area Character Count Limit with CSS3 and jQuery"

[1] "How can I display the HTML content of a Text Area within a div as HTML content and not text?"

[2] Andrey Fedoseev. "jQuery plugin to add realtime preview panel to text areas, similar to StackOverflow edit interface"

[3] Guillaume DE LA RUE. "A Markdown live editor in JS".

[4] Sacha Schmid. JavaScript word count

[5] Drew Schrauf. "JavaScript Wordcount That Works".

[6] "JavaScript word-count for any given DOM element"

[7] Jake Rocheleau. "Building a Live Text area Character Count Limit with CSS3 and jQuery"

[1]

[2]

[3]

[4]

[5]

[6]

[7]