键盘事件

开发工具与关键技术：
作者：郑健鹏
撰写时间：2019.6.8

jQuery键盘事件之keydown()与keyup()事件
    鼠标有mousedown,mouseup之类的事件，这是根据人的手势动作分解的2个触发行为。相对应的键盘也有这类事件，将用户行为分解成2个动作，键盘按下与松手，针对这样的2种动作，jQuery分别提供了对应keydown与keyup方法来监听 
 keydown事件：
    当用户在一个元素上第一次按下键盘上字母键的时候，就会触发它。使用上非常简单，与基本事件参数处理保持一致，这里使用不在重复了，列出使用的方法
     直接绑定事件
        $elem.keydown( handler(eventObject) )
     传递参数
        $elem.keydown( [eventData ], handler(eventObject) )
     手动触发已绑定的事件
        $elem.keydown()
        注意：
        keydown是在键盘按下就会触发
        keyup是在键盘松手就会触发

理论上它可以绑定到任何元素，但keydown/keyup事件只是发送到具有焦点的元素上，不同的浏览器中，可获得焦点的元素略有不同，但是表单元素总是能获取焦点，所以对于此事件类型表单元素是最合适的。
jQuery键盘事件之keypress()事件
在input元素上绑定keydown事件会发现一个问题：
keydown事件触发在文字还没敲进文本框，这时如果在keydown事件中输出文本框中的文本，得到的是触发键盘事件前的文本，而keyup事件触发时整个键盘事件的操作已经完成，获得的是触发键盘事件后的文本
当浏览器捕获键盘输入时，还提供了一个keypress的响应，这个跟keydown是非常相似。
keypress事件与keydown和keyup的主要区别
只能捕获单个字符，不能捕获组合键
无法响应系统功能键（如delete，backspace）
不区分小键盘和主键盘的数字字符
总而言之， KeyPress主要用来接收字母、数字等ANSI字符，而 KeyDown 和 KeyUP 事件过程可以处理任何不被 KeyPress 识别的击键。诸如：功能键（F1-F12）、编辑键、定位键以及任何这些键和键盘换档键的组合等。
下面是该页面的一些源代码以及一些简单是功能图：

<div class="container">
	<h2>keydown()与keyup()事件</h2>
	<div class="row">
		<div class="col-md-6">
			<h4>按下显示</h4>
			<div class="leftdiv">
			监听键盘按下:
			<input class="target1 form-control" type="text" value=""  /><br />
			按下显示输入的值:<em></em>
			</div>
		</div>
	<div class="col-md-6">
		<h4>松开显示</h4>
			<div class="rightdiv">
				监听键盘弹起:
				<input class="target2 form-control" type="text" value="" /><br />
				松手显示输入的值:<em></em>
			</div>
		</div>
	</div>
</div>