javascript - js輸入框限定字數問題
問題描述
js輸入框限定輸入框的字數，以下代碼
<input type=’text’ onkeyup='checkNumber($(this))'>function checkNumber($this){ let val=$this.val(); if(val.length > 10 ){alert(’字數超過10’); }}
在實際過程中，發現以下問題，如圖：
在輸入法中是，先顯示字母，再將字母拼音轉換成漢字。故可能在輸入的時候，字母加漢字已超過限定的字數，該如何解決？
問題解答
回答1：<input type='text' maxlength='10'>回答2：
oninput='checkNumber($(this))'
回答3：你不用alert，用輸入框后面加紅框的形式就可以了
回答4：我們設想下，input也輸入全英文的、或者中文，需要限定長度小于10,那么maxlength='10'是需要的，checkNumber函數然后判斷是否input有存在中文，有的話判斷最后字符是否是英文。如果沒有中文說明說純英文就提示，這樣方案不足之處有中文和英文一起存在不好判斷。
回答5：下面這個例子，不知會不會幫到你
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>input 事件兼容處理以及中文輸入法優化</title></head><body> <input type=’text’> <script>var input = document.querySelector(’input’);var isLock = false;//當瀏覽器有非直接的文字輸入時, compositionstart事件會以同步模式觸發.input.addEventListener(’compositionstart’, function(){ isLock = true;})//當瀏覽器是直接的文字輸入時, compositionend會以同步模式觸發.input.addEventListener(’compositionend’, function(){ isLock = false;});input.addEventListener(’input’,function(e){ if(!isLock)console.log(this.value);}); </script></body></html>回答6：
onkeyup事件換成onblur事件解決。
相關文章：
1. php程序員工具箱裝的mysql怎么刪除啊2. javascript - vue異步數據打印問題3. python - 已關注粉絲再次掃描微信帶參數二維碼報錯4. javascript - 微信h5頁面自定義按鈕使之具有分享頁面公共5. javascript - Vue的‘v-for’循環中，子組件接收‘prop’傳值不更新的奇葩怪異問題求分析。6. css - transform: translateY(-50%)在360瀏覽器極速模式下使得文字變模糊了7. python - 用生成器迭代數據在文件和IDLE中運行結果不一致，8. node.js - express-session 怎么支持無 cookie 的微信小程序session9. html5上的ICON一般去哪里找?10. javascript - 關于fullpage.js 自動高度失效的問題
網公網安備