检测键盘按键(三)——keypress和keydown、keyup

keypress:在IE和chrome中主要用来捕获数字(注意:包括Shift+数字的符号)、字母(注意:包括大小写)、小键盘等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜单键}、{开始键}和方向键外的ANSI字符。

在IE中Esc有值,Chrome中不能触发。

FF都可以触发keypress,除了Alt、Ctrl、Shift键。

keypress可以捕获组合键,比如当用户按下shift + 1时,keypress是对这个按键事件进行解析后返回一个可打印的“!”字符,而keydown只能

输出1。

对于屏幕可打印字符时,keypress是首选。

keydown:通常可以捕获键盘除了PrScrn所有按键。不能判断单个字符的大小写。因此多用于捕获功能键。

PrScrn 按键KeyPress、KeyDown和KeyUp 都不能捕获。

<!DOCTYPE html>
<HTML>
<HEAD>
    <meta charset="utf-8">
</HEAD>
<BODY>
<script type="text/javascript">
    var keystring = "";//记录按键的字符串
    function $(s){return document.getElementById(s)?document.getElementById(s):s;}
    function keypress(e)
    {
        var currKey=0,CapsLock=0,e=e||event;
        currKey=e.keyCode||e.which||e.charCode;
        CapsLock=currKey>=65&&currKey<=90;
        switch(currKey)
        {
           //屏蔽了退格、制表、回车、空格、方向键、删除键
             case 8: case 9:case 13:case 32:case 37:case 38:case 39:case 40:case 46:keyName = "";break;
    default:keyName = String.fromCharCode(currKey); break;
        }
        keystring += keyName;
    }
    function keydown(e)
    {
        var e=e||event;
        var currKey=e.keyCode||e.which||e.charCode;
        if((currKey>7&&currKey<14)||(currKey>31&&currKey<47))
        {
            switch(currKey)
                {
                 case 8: keyName = "[退格]"; break;
    case 9: keyName = "[制表]"; break;
     case 13:keyName = "[回车]"; break;
     case 32:keyName = "[空格]"; break;
    case 33:keyName = "[PageUp]";   break;
     case 34:keyName = "[PageDown]";   break;
    case 35:keyName = "[End]";   break;
     case 36:keyName = "[Home]";   break;
     case 37:keyName = "[方向键左]";   break;
     case 38:keyName = "[方向键上]";   break;
     case 39:keyName = "[方向键右]";   break;
      case 40:keyName = "[方向键下]";   break;
     case 46:keyName = "[删除]";   break;
     default:keyName = "";    break;
                }
                    keystring += keyName;
            }
            $("content").innerHTML=keystring;
        }
        function keyup(e)
        {
            $("content").innerHTML=keystring;
        }
        document.onkeypress=keypress;
        document.onkeydown =keydown;
        document.onkeyup =keyup;
</script>
<input type="text" />
<input type="button" value="清空记录" onclick="$(‘content‘).innerHTML = ‘‘;keystring = ‘‘;"/>
<br/>请按下任意键查看键盘响应键值:<span id="content"></span>
</BODY>
</HTML>

检测键盘按键(三)——keypress和keydown、keyup

时间: 2024-08-08 05:35:27

检测键盘按键(三)——keypress和keydown、keyup的相关文章

检测键盘按键(二)——jquery写法

jquery写法 keyCode: IE.Chrome支持,在FF下,keyCode返回非字符按键的Unicode,如果是字符按键返回始终为0. which:   FF,Chrome支持:在IE下,which和charCode始终为undefined ,jquery方式下和keyCode值相同. charCode:   Chrome支持,在FF下,非字符键返回0,如果是字符按键返回Unicode <!DOCTYPE html> <html> <head> <tit

jquery 键盘事件 keypress() keydown() keyup()

事件的定义 完整的 key press 过程分为两个部分:1. 按键被按下:2. 按键被松开. 当按钮被按下时,发生 keydown 事件. keydown() 方法触发 keydown 事件,或规定当发生 keydown 事件时运行的函数. 当按钮被松开时,发生 keyup 事件.它发生在当前获得焦点的元素上. keyup() 方法触发 keyup 事件,或规定当发生 keyup 事件时运行的函数. keypress 事件与 keydown 事件类似.当按钮被按下时,会发生该事件.它发生在当前

js keyup、keypress和keydown事件 详解

js keyup.keypress和keydown事件  详解 js keyup.keypress和keydown事件都是有关于键盘的事件 当一个按键被pressed 或released在每一个现代浏览器中,都可能有三种客户端事件. keydown event keypress event keyup event keydown事件发生在键盘的键被按下的时候,接下来触发keypress事件. keyup 事件在按键被释放的时候触发. 这三个事件在页面中的使用方法如下例: <input id=&quo

javascript 中 keyup、keypress和keydown事件

keyup.keypress和keydown事件都是有关于键盘的事件 1. keydown事件在键盘的键被按下的时候触发,keyup 事件在按键被释放的时候触发    keydown.keypress事件触发在文字还没敲进文本框,这时如果在keydown.keypress事件中输出文本框中的文本,得到的是触发键盘事件前的文本,而keyup事件触发时整个键盘事件的操作已经完成,获得的是触发键盘事件后的文本 注意:        KeyDown触发后,不一定触发KeyUp,当KeyDown 按下后,

keypress 、keydown、keyup后触发回车

1.keypress .keydown.keyup的区别 keypress表示键盘按下的全过程,只有按下任意字母数字键(后退.删除等系统功能键无效)时才触发,捕获到的keyCode区分大小写 keydown表示键盘按下但还没弹起之前触发,即前半段触发,按下任意键盘键均可触发,捕获到的keyCode不区分大小写 keyup表示键盘按下后弹起的过程中触发,即后半段触发,按下任意键盘键均可触发,捕获到的keyCode不区分大小写 事件的触发顺序 keydown -> keypress -> keyu

Android App监听软键盘按键的三种方式(转)

最近有类似需求,在csdn上刚好发现,粘贴过来,以防止忘记喽 前言: 我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的“GO”按键加载url页面:在点击搜索框的时候,点击右下角的search符号键可以进行搜索:或者在全部数据输入完毕后,点击右下角的"done"就马上进行下一步操作. 效果图: function 1: 重写Activity的dispatchKeyEvent(KeyEvent event)方法,在其中

键盘-App监听软键盘按键的三种方式

前言: 我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的“GO”按键加载url页面:在点击搜索框的时候,点击右下角的search符号键可以进行搜索:或者在全部数据输入完毕后,点击右下角的"done"就马上进行下一步操作. 效果图: function 1: 重写Activity的dispatchKeyEvent(KeyEvent event)方法,在其中监听KeyEventKey.KEYCODE_ENTER键(右下

Android App监听软键盘按键的三种方式

前言: 我们在android手机上面有时候会遇到监听手机软键盘按键的时候,例如:我们在浏览器输入url完毕后可以点击软键盘右下角的"GO"按键加载url页面:在点击搜索框的时候,点击右下角的search符号键可以进行搜索:或者在全部数据输入完毕后,点击右下角的"done"就马上进行下一步操作. 效果图: function 1: 重写Activity的dispatchKeyEvent(KeyEvent event)方法,在其中监听KeyEventKey.KEYCODE

KeyPress 和KeyDown 、KeUp之间的区别

前几天,在写完一个功能模块上线测试的时候,出现了一个诡异的问题.input 框在输入查询内容之后,按回车键居然有两种不同的表现形式(input 框没有绑定键盘事件),谷歌和火狐功能正常,但IE在按了回车键以后居然自动调用方法. 页面结构:标签上没绑定任何键盘事件,控制器内也没有给元素绑定键盘事件. <div class="search-input-tel search-input-visit-tel" > <input class="searchinput-