onkeyup,onkeydown和onkeypress的区别介绍

 更新时间:2013年10月21日 17:00:21   作者:  
三者在事件的响应上还有一点不同,就是onkeydown 、onkeypress事件响应的时候输入的字符并没有被系统接受,而响应onkeyup的时候,输入流已经被系统接受
msdn上有三者的区别:

名称 说明

onkeypress

这个事件在用户按下并放开任何字母数字键时发生。系统按钮(例如,箭头键和功能键)无法得到识别。

onkeyup

这个事件在用户放开任何先前按下的键盘键时发生。

onkeydown

这个事件在用户按下任何键盘键(包括系统按钮,如箭头键和功能键)时发生。

======================
复制代码 代码如下:

<html>
<script>
function checkForm(){
if(event.keyCode ==13){
event.keyCode =9;
}
}
</script>
<body>
<form name ="form1">
<input type="text" name = "text1" onkeydown = "checkForm()">
<input type="button" name = "button1" value="按钮">
</form>
</body>
</html>

当按下回车时,焦点从文本框移到按钮上。如果把它换成“onkeypress”,焦点不会转移,也不会失去。但是如果换成“onkeyup”,则失去焦点,页面重新载入。

测试发现onkeydown 事件最先执行,其次是onkeypress,最后是onkeyup;onkeydown 和onkeypress会影响onkeyup的执行。三个事件同事在的话,都是alert的话,只会弹出2个alert,up事件的alert不会弹出。

三者在事件的响应上还有一点不同,就是onkeydown 、onkeypress事件响应的时候输入的字符并没有被系统接受,而响应onkeyup的时候,输入流已经被系统接受。由于onkeydown 比onkeypress先执行,再根据上面的例子可以知道,onkeydown 触发的时候输入流正要进入系统,也就是说onkeydown 事件一完,输入流就进入了系统,无法改变。所以通过onkeydown 事件可以改变用户是按了哪个键;而onkeypress事件则是在输入流进入系统后触发的,但输入流暂未被系统处理,此时已经不能改变输入流了;onkeyup则是输入流被系统处理后发生的。

相关文章

  • 深入了解JavaScript中的Symbol的使用方法

    深入了解JavaScript中的Symbol的使用方法

    这篇文章主要介绍了深入了解JavaScript中的Symbol的使用方法,本文针对ES6版本的JS进行讲解,需要的朋友可以参考下
    2015-07-07
  • 告诉你什么是javascript的回调函数

    告诉你什么是javascript的回调函数

    在javascript中回调函数非常重要,它们几乎无处不在。像其他更加传统的编程语言都有回调函数概念,但是非常奇怪的是,完完整整谈论回调函数的在线教程比较少,倒是有一堆关于call()和apply()函数的,或者有一些简短的关于callback的使用示例。
    2014-09-09
  • Javascript中arguments和arguments.callee的区别浅析

    Javascript中arguments和arguments.callee的区别浅析

    这篇文章主要介绍了Javascript中arguments和arguments.callee的区别浅析,本文用一个实例来理解它们的区别,需要的朋友可以参考下
    2015-04-04
  • 老生常谈 关于JavaScript的类的继承

    老生常谈 关于JavaScript的类的继承

    下面小编就为大家带来一篇老生常谈 关于JavaScript的类的继承。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 在JavaScript中操作时间之getYear()方法的使用教程

    在JavaScript中操作时间之getYear()方法的使用教程

    这篇文章主要介绍了在JavaScript中操作时间之getYear()方法的使用教程,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06
  • Javascript this 关键字 详解

    Javascript this 关键字 详解

    Javascript是一种很灵活的语言, 而This关键字又是灵活中的灵活, 但是因为它的灵活, 也注定了它的难用.以前我用this的时候, 都会觉得不踏实, 老是担心它不知道怎么地就会指到另外的什么地方.其实, 这都是因为, 我们对它的不了解.
    2014-10-10
  • 简介JavaScript中POSITIVE_INFINITY值的使用

    简介JavaScript中POSITIVE_INFINITY值的使用

    这篇文章主要介绍了简介JavaScript中POSITIVE_INFINITY值的使用,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-06-06
  • 跨域请求的完美解决方法(JSONP, CORS)

    跨域请求的完美解决方法(JSONP, CORS)

    下面小编就为大家带来一篇跨域请求的完美解决方法(JSONP, CORS)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • java中String类型变量的赋值问题介绍

    java中String类型变量的赋值问题介绍

    下面小编就为大家带来一篇java中String类型变量的赋值问题介绍。小编觉得挺不错的。现在分享给大家,给大家一个参考。
    2016-03-03
  • FF(火狐)浏览器无法执行window.close()解决方案

    FF(火狐)浏览器无法执行window.close()解决方案

    这篇文章主要介绍了FF(火狐)浏览器无法执行window.close()解决方案,需要的朋友可以参考下
    2014-11-11

最新评论