[Javascript] input 輸入處理：限制只允許輸入英文、數字和橫線 (-) 並自動轉換為大寫
2023-06-29
最近我遇到了一個 JavaScript 的問題，雖然不是什麼大事，但對方需要在一個 input 欄位中，只允許輸入英文、數字和橫線 (-)。
此外，他希望輸入小寫英文字母時自動轉換為大寫。儘管這聽起來有些簡單，但每次都需要重新寫一次，因此我想將這個解決方案記錄下來。
這裡是我所使用的方法：在 onKeypress 事件中使用正則表達式（regex）進行輸入阻擋，
確保只有英文、數字和橫線 (-) 能夠進入。接著，在 onKeyUp 事件中，我將輸入的文字轉換為大寫，確保統一的輸入格式。
值得一提的是，我在網路上看到了一個使用 CSS 的方法，即使用 style="text-transform: uppercase"。
這樣可以讓輸入的字"看起來"是大寫，但在取值時仍然是小寫。雖然這是一個簡單的做法
但需要特別注意。如果在送出前將值轉換為大寫，也是一種方便的解決方案，避免使用 onKeyUp 的方法。