問題：在中文輸入法輸入文字時按ENTER鍵；綁定keyup事件會將輸入法中的英文文字輸入到文字框并直接觸發(fā)發(fā)送按鈕

鍵盤事件：

當(dāng)一個按鍵被pressed或者released，在每一個瀏覽器中都可能會觸發(fā)三種鍵盤事件

keydown
keypress
keyup

keydown事件發(fā)生在按鍵被按下的時候，接著觸發(fā)keypress，松開按鍵的時候觸發(fā)keyup事件

中文輸入法：

firfox：輸入觸發(fā)keydown，回車確認(rèn)輸入觸發(fā)keyup
chrome：輸入觸發(fā)keydown、keyup，回車確認(rèn)輸入只觸發(fā)keydown
IE：輸入觸發(fā)keydown、keyup，回車確認(rèn)輸入觸發(fā)keydown，keyup
Safari：輸入觸發(fā)keydown、keyup，回車確認(rèn)輸入觸發(fā)keydown，keyup
opera：輸入觸發(fā)keydown、keyup，回車確認(rèn)輸入觸發(fā)keydown，keyup
在input、textarea中，中文輸入法時：沒有觸發(fā)keypress事件

keypress事件：對中文輸入法支持不好，無法響應(yīng)中文輸入；無法響應(yīng)系統(tǒng)功能鍵

HTML代碼：

<textarea name="" id="text" cols="30" rows="5"></textarea> 
  <script type="text/javascript"> 
    var text = document.getElementById('text'); 
    text.onkeydown = function(e) { 
      console.log('keydown'); 
      if(e.keyCode == 13) { 
        console.log('keydown enter send'); 
      } 
      console.log('value', text.value); 
    } 
    text.onkeypress = function(e) { 
      console.log('keypress'); 
      console.log('value', text.value); 
    } 
    text.onkeyup = function(e) { 
      console.log('keyup'); 
      if(e.keyCode == 13) { 
        console.log('keyup enter send'); 
      } 
      console.log('value', text.value); 
    } 
  </script>

英文輸入法：

上圖可得結(jié)論：

keydown、keypress發(fā)生在文字還沒敲入輸入框時，如果在keydown、keypress事件中輸出文本框的文本，得到的是觸發(fā)鍵盤事件前文本框中的文本；

keyup事件觸發(fā)時，整個鍵盤事件輸入文字的操作已經(jīng)完成，得到的是觸發(fā)鍵盤事件后的文本內(nèi)容。

中文輸入法：【沒有keypress事件】

按下enter鍵確認(rèn)后：

中文輸入法在輸入未確定時按下回車鍵，keydown與keyup效果不同，keydown不會觸發(fā)預(yù)設(shè)的回車方法事件

解答：

大多數(shù)輸入法都是在keydown中完成輸入過程，所以如果回車提交是在keyup事件中的話就會出現(xiàn)輸完字后直接觸發(fā)回車鍵提交，從而產(chǎn)生沖突問題。

辦法：回車提交事件改為keydown，這時候當(dāng)keydown事件發(fā)生的時候是在輸入法上，而不會發(fā)生在提交框的發(fā)送事件上，進而解決了沖突?！?/span>

部分tips：

KeyDown觸發(fā)后，不一定觸發(fā)KeyUp，當(dāng)KeyDown 按下后，拖動鼠標(biāo)，那么將不會觸發(fā)KeyUp事件。

KeyPress主要用來捕獲數(shù)字(注意：包括Shift+數(shù)字的符號)、字母（注意：包括大小寫）、小鍵盤等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜單鍵}、{開始鍵}和方向鍵外的ANSI字符

KeyDown 和KeyUp 通?？梢圆东@鍵盤除了PrScrn所有按鍵

KeyPress 只能捕獲單個字符

KeyDown 和KeyUp 可以捕獲組合鍵。

KeyPress 可以捕獲單個字符的大小寫

KeyDown和KeyUp 對于單個字符捕獲的KeyValue 都是一個值，也就是不能判斷單個字符的大小寫。

KeyPress 不區(qū)分小鍵盤和主鍵盤的數(shù)字字符。

KeyDown 和KeyUp 區(qū)分小鍵盤和主鍵盤的數(shù)字字符。

其中PrScrn 按鍵KeyPress、KeyDown和KeyUp 都不能捕獲。

在使用鍵盤的時候，通常會使用到CTRL+SHIFT+ALT 類似的組合鍵功能。

以上這篇輸入法的回車與消息發(fā)送快捷鍵回車的沖突解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論