onkeydown 、onkeypress 、onKeyUp 事件

最新推荐文章于 2021-10-09 16:52:51 发布
最新推荐文章于 2021-10-09 16:52:51 发布
阅读量1.7k 收藏 1
点赞数
分类专栏： JavaScript

onkeydown 事件


定义和用法

onkeydown 事件会在用户按下一个键盘按键时发生。

语法

οnkeydοwn="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签：

<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>

支持该事件的 JavaScript 对象：

document, image, link, textarea

提示和注释

浏览器差异：Internet Explorer 使用 event.keyCode 取回被按下的字符，而 Netscape/Firefox/Opera 使用 event.which。

实例

在本例中，用户无法在输入框中键入数字：

<html>
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
  {
  keynum = e.keyCode
  }
else if(e.which) // Netscape/Firefox/Opera
  {
  keynum = e.which//which 属性指示按了哪个键或按钮。
  }

keychar = String.fromCharCode(keynum)
numcheck = /\d/
return !numcheck.test(keychar)
}
</script>

<form>
<input type="text" οnkeydοwn="return noNumbers(event)" />
</form>

</html>

onkeypress 事件


定义和用法

onkeypress 事件会在键盘按键被按下并释放一个键时发生。

语法

οnkeypress="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签：

<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>

支持该事件的 JavaScript 对象：

document, image, link, textarea


onKeyUp 事件


定义和用法

onkeyup 事件会在键盘按键被松开时发生。

语法

οnkeyup="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签：

<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>

支持该事件的 JavaScript 对象：

document, image, link, textarea

实例

当您在例子中的输入域中键入字符时，字符会被更改为大写（逐一地）：

<html>

<head>
<script type="text/javascript">
function upperCase(x)
{
var y=document.getElementById(x).value
document.getElementById(x).value=y.toUpperCase()
}
</script>
</head>

<body>
	
输入您的姓名： <input type="text" id="fname" οnkeyup="upperCase(this.id)" />

</body>
</html>


keypress和keydown区别

注意:

  1. KeyDown触发后，不一定触发KeyUp，当KeyDown 按下后，拖动鼠标，那么将不会触发KeyUp事件。
  2. KeyPress主要用来捕获数字(注意：包括Shift+数字的符号)、字母（注意：包括大小写）、小键盘等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜单键}、{开始键}和方向键外的ANSI字符
  3. KeyDown 和KeyUp 通常可以捕获键盘除了PrScrn所有按键(这里不讨论特殊键盘的特殊键）。
  4. KeyPress 只能捕获单个字符。
  5. KeyDown 和KeyUp 可以捕获组合键。
  6. KeyPress 可以捕获单个字符的大小写。
  7. KeyDown和KeyUp 对于单个字符捕获的KeyValue 都是一个值，也就是不能判断单个字符的大小写。
  8. KeyPress 不区分小键盘和主键盘的数字字符。
  9. KeyDown 和KeyUp 区分小键盘和主键盘的数字字符。
  10. 其中PrScrn 按键KeyPress、KeyDown和KeyUp 都不能捕获。

  11. 在使用键盘的时候，通常会使用到CTRL+SHIFT+ALT 类似的组合键功能。对于此，我们如何来判定？

         通过KeyUp 事件能够来处理（这里说明一下为什么不用KeyDown，因为在判定KeyDown的时候，CTRL、SHIFT和ALT 属于一直按下状态，然后再加另外一个键是不能准确捕获组合键，所以使用KeyDown 是不能准确判断出的，要通过KeyUp 事件来判定 ）

         这里简单的列举出CTRL+其它键的组合判定代码：

    private void Form3_KeyUp(object sender, KeyEventArgs e)
{
if (e.Control)
{
MessageBox.Show("KeyUp:Ctrl+" + e.KeyValue.ToString());
}
}




转自w3school，http://www.cnblogs.com/manongxiaobing/archive/2012/11/05/2755412.html

ssisse
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
浅析OnKeyPress事件和OnKeyDown、OnKeyUp事件
javaqun的博客
10-19 2329
OnKeyPress事件     OnKeyPress事件是在用户按下键盘上任何一个可打印的字符时发生，只有能接收键盘输入的组件才有OnKeyPress事件。我们常常利用OnKeyPress事件截取在编辑框和组合框组件中所输入的击键，还可以立即测试击键的有效性或在字符输入时对其进行一定的格式处理。     例如，在TEdit组件上捕获OnKeyPress事件，判断输入的是否是小
对多个button触发enter操作，执行不同的操作
weixin_34319817的博客
11-24 192
1.首先为需要触发enter事件的控件中添加onkeydown事件: 　　支持onkeydown事件的标签为： <a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, &l...
ADB控制手机命令
weixin_30732487的博客
05-22 1687
手机端配置tcp方式连接 su setprop service.adb.tcp.port 5555 stop adbd start adbd 首先使用管理员权限，然后打开监听5555端口 电脑端使用adb远程连接 adb connect ip_address 此时手机端弹出认证请求点击确认即可连接成功。 通过ADB控制手机...
JavaScript监听键盘事件，组合键事件
热门推荐
projectNo的博客
09-04 2万+
监听键盘事件，比如说提交表单或者确认通过键盘操作会很方便，有时候需要组合键比如复制粘贴等。基本原理是当按下某一个键时，返回对应的值，然后再判断用户按下了哪个键，进行对比。一、键盘监听是直接在整个页面文档上进行监听的，也就是document上，以下是原生的使用案例：1、某个键按下事件：onkeydown 2、某个键被按下或者按住：onkeypress 3、某个按下的键被松开：onkeyupdocu
keydown与keypress的区别,组合键
anmangchen6041的博客
07-18 1132
Shift 是一个集合变量。type TShiftState =set of (ssShift, ssAlt, ssCtrl, ssLeft, ssRight, ssMiddle, ssDouble);也就是说TShiftstate类型有ssShift, ssAlt, ssCtrl, ssLeft（鼠标左键）, ssRight（鼠标右键）, ssMiddle（鼠标中键）, ssDoub...
js的keydown对应按键及其简单使用方法
suger_yeezy的博客
04-18 7438
js 里面的键盘事件经常用到，所以收集了键盘事件对应的键码来分享下： keyCode 8 = BackSpace BackSpace keyCode 9 = Tab Tab keyCode 12 = Clear keyCode 13 = Enter keyCode 16 = Shift_L keyCode 17 = Control_L keyCode 18 = Alt_L keyCode 19 =...
onkeyup，onkeydown和onkeypress的区别介绍
09-04
在JavaScript中，`onkeyup`、`onkeydown`和`onkeypress`是三种与键盘交互相关的事件，它们各自有着特定的用途和响应时机。理解这三个事件的区别对于开发交互式网页应用至关重要。 首先，`onkeydown`事件会在用户按...
javascript onkeydown,onkeyup,onkeypress,onclick,ondblclick
10-30
昨天群里面的朋友问了个比较有意思的问题,keydown,keyup,keypress事件的先后顺序。
onkeypress和onkeydown以及onkeyup的区别
04-11
onkeypress、onkeydown和onkeyup事件的区别 onkeypress、onkeydown和onkeyup是三种常用的JavaScript事件，都是与键盘输入相关的事件，但它们之间存在着一些细微的区别。 首先，让我们来看一下这三个事件的触发顺序...
js onkeypress与onkeydown 事件区别详细说明
10-27
JavaScript中的`onkeypress`和`onkeydown`是两种常见的键盘事件，它们在处理用户与页面交互时起到关键作用。理解这两个事件的区别对于创建响应式的Web应用程序至关重要。 首先，`onkeydown`事件会在用户按下键盘上...
javascript onkeydown实现键盘快捷键控制页面
10-30
javascript onkeydown实现键盘快捷键控制页面
网页: onkeypress事件与onkeydown事件的区别
酷伊奥
07-19 3397
一、了解区别 1、onkeypress事件：用户在按下并放开键盘上的按钮时所触发的事件，但是键盘上的功能区按钮是无法识别的（例如：F1-F12，箭头，Delete 等等）。 2、onkeydown事件：用户在按下键盘上的按钮时所触发的事件，包括键盘上的功能区按钮（例如：F1-F12，箭头，Delete 等等）。 二、具体的区别 1、onkeypress事件是用户在按下并放开键盘上的按钮时触发，而onkeydown事件是用户在按下但没有放开键盘上的按钮时触发。 2、onkeypress无法识别功能..
JS:键盘事件（onkeydown 、onkeypress、 onkeyup三个）
weixin_59519449的博客
10-09 3406
1.键盘事件key 属性 描述 onkeydown 某个键盘按键被按下 onkeypress 某个键盘按键被按下。 onkeyup 某个键盘按键被松开。 事件相关的事件发生次序： ...
浅析OnKeyPress事件和OnKeyDown/OnKeyUp事件
yp120yp的专栏
03-03 1088
OnKeyPress事件<br />    OnKeyPress事件是在用户按下键盘上任何一个可打印的字符时发生，只有能接收键盘输入的组件才有OnKeyPress事件。我们常常利用OnKeyPress事件截取在编辑框和组合框组件中所输入的击键，还可以立即测试击键的有效性或在字符输入时对其进行一定的格式处理。<br />    例如，在TEdit组件上捕获OnKeyPress事件，判断输入的是否是小写字母，如果是，将其转换为大写字母，代码如下：<br />    void __fastcall TForm1:
el-input限制只能输入数字（开发小记）
Master_Tang的博客
01-05 3715
输入框中限制通常有三种处理方法 第一种：设置type属性（不推荐） 设置type属性为number，text等等，此方法输入框的后面会有不必要样式出现 <el-input type="number"></el-input> 第二种：在属性中添加onkeyup或者oninput进行正则判断 onkeyup，oninput，onchange各有好坏，在这里，推荐onkeyup，在要求不是太高的系统中可以这样使用 <el-input v-model="fo
Javascript中的onkeydown、onkeypress、onkeyup的区别
欧阳晓峰的博客
10-21 3227
Javascript
onkeypress 和 onkeydown 的区别
u011574239的专栏
05-06 1229
 1. 一个放开一个没有放开，onkeydown 先于 onkeypress 发生。  2.onkeypress 无法系统按钮。  2.onkeydown 捕获的 keyCode 不区分字母大小，而 onkeypress 区分。  onkeypress是在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。  onkeyup 是在用户放开任何先前按下
html之文本框的onkeydown()响应Enter键——键盘事件
程序羊的博客
10-18 8992
事件目录常见的jQuery事件常见的鼠标、键盘事件 很多时候，我们需要在html的输入框中按下回车键（Enter）做模糊查找，那么就可以使用到 onkeydown 事件了。 示例代码： <html> <body> <input onkeydown="if(event.keyCode==13) {test()}"/> <script> fun...
单选题(80分) 52、(1分)以下哪个事件在用户按下任意键时触发？ OA、onmousedown OB、onkeydown O·C、onkeyup D、onkeypress
最新发布
06-01
在用户按下任意键时，`onkeydown` 事件会被触发，选项B是正确的。`onkeydown` 事件在用户按下键盘上的任意键时触发，无论是否有字符输出。在该事件发生时，可以使用 `event` 对象来获取按下的键的相关信息。例如，...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值