解決onKeypress中文輸入不觸發問題

時間 2019-11-06

標籤解決 onkeypress 中文輸入觸發問題简体版

原文原文鏈接

onKeypress事件會在鍵盤按鍵被按下並釋放一個鍵時發生。在對input文本綁定時，輸入數字、字母、特殊符號是都會觸發onKeypress事件，但惟獨輸入中文時，onKeypress事件是不會觸發的！我以爲能夠使用onInput事件代替！html

oninput 是 HTML5 的標準事件，對於檢測 textarea, input:text, input:password 和 input:search 這幾個元素經過用戶界面發生的內容變化很是有用，在內容修改後當即被觸發，不像 onchange 事件須要失去焦點才觸發。oninput 事件在主流瀏覽器的兼容狀況以下：瀏覽器

有一個需求是這樣的：在input框只能輸入數字，能兼容火狐，IE9的。ui

若是是使用onKepress事件綁定input，輸入中文時就會出現不觸發onKeypress事件，也就是沒有任何的意義！this

演示地址 ==> http://runjs.cn/detail/pfojehd8spa

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>RunJS</title>
        <script>
            // scripts
            $(function() {
                // 給含有number屬性的input控件綁定input事件
                // 這樣之後要用的時候，就給input添加一個number屬性就能夠！
                $('body').detelage('input[number]:not(:hidden)', 'input', function() {
                    var $this = $(this), 
                        val = $this.val();
                    if (val) $this.val(val.replace(/[^0-9]/g, ''));
                });
            });
        </script>
    </head>
    <body>
        <!-- 給input 添加number屬性 -->
        <input type="text" number />
    </body>
    </body>
</html>

相關標籤/搜索