js實現輸入長度的限制,相容中文輸入的辦法

我們在專案中,可能會經常遇到輸入框輸入漢字 + 字母/符號等混合內容,並要對內容進行長度限制的需求.

很多朋友喜歡直接對拿到的輸入的value進行長度限制,但是實際做過的朋友可能都會遇到問題,當輸入中文、日文這種需要多個字母拼成乙個文字的語言時,往往文字沒有輸入完成,拼寫的文字就已經超出長度的限制了.從而導致,無法輸入;

為了要解決這個問題,需要知道,使用者正在輸入的文字是否是復合輸入.

如果是復合輸入,我們要想辦法監聽復合輸入的結果,而不是輸入的過程.

如果是非復合輸入,我們只需要監聽oninput事件就可以了

所以,我們這裡為了解決問題,需要用到compositionstart、compositionend、input這幾個事件來實現復合輸入的長度限制

// 開關,是否是復合輸入

let iscomposition =
false
;// 可以輸入的最大長度
const maxlength =10;
// 長度驗證規格
function
maxlengthrule
(value)
}// 復合輸入開始
textarea.
addeventlistener
('compositionstart'
,(e)
=>
)// 復合輸入結束
textarea.
addeventlistener
('compositionend'
,(e)
=>
iscomposition =
false;}
)// 非復合輸入
textarea.
addeventlistener
('input'
,(e)
=>
})

限制輸入 中文，英文，數字分類 （js）

只能輸漢字 nkeyup value value.replace u4e00 u9fa5 g,onbeforepaste clipboarddata.setdata text clipboarddata.getdata text replace u4e00 u9fa5 g,只能輸入數字 nkeyup...

完美限制UITextField的輸入長度

要限制乙個uitextfield的輸入字數，很多人首先想到的是通過uitextfielddelegate 下面這個 方法實現 bool textfield uitextfield textfield shouldchangecharactersinrange nsrange range replac...

完美限制UITextField的輸入長度

要限制乙個uitextfield的輸入字數，很多人首先想到的是通過uitextfielddelegate 下面這個 方法實現 bool textfield uitextfield textfield shouldchangecharactersinrange nsrange range replac...