防止用戶在輸入字段中刪除

Question

我想要一個文本字段（HTML 中的<input> ），用戶只能使用它來編寫文本，但是在刪除文本時，它應該阻止他更新輸入元素的 state。

 <input type="text" />

除了檢測用戶在鍵盤上的按鍵操作（即使用onKeyUp屬性）並觀察用戶按鍵操作直到他按下 Backspace 字符之外，我想不出一個解決方案：

 const input = document.querySelector('input') input.addEventListener('keydown', (e) => { const keyCode = e.keyCode if (keyCode === 8) console.log("Backspace pressed!") })

 <input type="text" />

然而，這里有一個缺失的部分，即使用戶無法通過 Backspace 鍵清除輸入內容，他也可以使用Del鍵。 所以我必須像處理 Backspace 鍵一樣處理 Del 鍵。

現在，還有一個問題，就是試圖通過覆蓋內容來修改輸入內容，如下所示：

然后，在那之后，我將不得不通過cutting內容來防止用戶編輯文本（我不知道該怎么做）。

那么，有哪些替代方案？

請隨意使用 HTML、JavaScript、CSS，甚至 React。