JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)


Posted in Javascript onOctober 17, 2014

JavaScript onkeypress 事件

用户按下或按住一个键盘按键时会触发 onkeypress 事件。

注意:onkeypress 事件与 onkeydown 事件有些细微差别,onkeypress 事件不做相应功能键按下的处理。具体可将下面的示例更改为 onkeydown 事件后,可输入 !@#$ 等特殊字符即可体会出二者之间的差别。

提示

Internet Explorer/Chrome 浏览器使用 event.keyCode 取回被按下的字符,而 Netscape/Firefox/Opera 等浏览器使用 event.which。

利用 onkeypress 事件只允许输入数字

下面是一个利用 onkeypress 事件只允许用户在表单域输入数字的例子:

<html>

<head>

<script>

function checkNumber(e)

{

    var keynum = window.event ? e.keyCode : e.which;

    //alert(keynum);

    var tip = document.getElementById("tip");

    if( (48<=keynum && keynum<=57) || keynum == 8 ){

        tip.innerHTML = "";

        return true;

    }else {

        tip.innerHTML = "提示:只能输入数字!";

        return false;

    }

}   

</script>
</head>

<body>

<div>请输入数字:<input type="text" onkeypress="return checkNumber(event);" />

<span id="tip"></span>

</div> 

</body>

</html>

event.keyCode/event.which 得到的是一个按键对应的数字值(Unicode 编码),常用键值列于 onkeydown 事件一节中。例子中对 8 的值做特殊处理,是为了在文本域中支持退格(Backspace)键。

Javascript 相关文章推荐
网页自动跳转代码收集
Sep 27 Javascript
javaScript 利用闭包模拟对象的私有属性
Dec 29 Javascript
JS实现图片放大镜效果的方法
Feb 27 Javascript
在Node.js应用中使用Redis的方法简介
Jun 24 Javascript
javascript获取本机操作系统类型的方法
Aug 13 Javascript
JavaScript脚本判断蜘蛛来源的方法
Sep 22 Javascript
JavaScript学习笔记之数组的增、删、改、查
Mar 23 Javascript
详解Vue项目在其他电脑npm run dev运行报错的解决方法
Oct 29 Javascript
跨域请求两种方法 jsonp和cors的实现
Nov 11 Javascript
微信小程序和H5页面间相互跳转代码实例
Sep 19 Javascript
微信小程序如何获取用户头像和昵称
Sep 23 Javascript
原生JavaScript实现刮刮乐
Sep 29 Javascript
JavaScript onkeydown事件入门实例(键盘某个按键被按下)
Oct 17 #Javascript
JavaScript字符串对象toUpperCase方法入门实例(用于把字母转换为大写)
Oct 17 #Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
Oct 17 #Javascript
JavaScript字符串对象substring方法入门实例(用于截取字符串)
Oct 17 #Javascript
让IE8浏览器支持function.bind()方法
Oct 16 #Javascript
jquery获取radio值(单选组radio)
Oct 16 #Javascript
js数组的基本操作(很全自己整理的)
Oct 16 #Javascript
You might like
正义联盟的终局之战《天启星战争》将成为DC动画宇宙的最后一部
2020/04/09 欧美动漫
php下判断数组中是否存在相同的值array_unique
2008/03/25 PHP
php制作文本式留言板
2015/03/18 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
Yii2.0使用阿里云OSS的SDK上传图片、下载、删除图片示例
2017/09/20 PHP
ExtJS 下拉多选框lovcombo
2010/05/19 Javascript
jQuery学习笔记之总体架构
2014/06/03 Javascript
一段非常简单的js判断浏览器的内核
2014/08/17 Javascript
JavaScript获得指定对象大小的方法
2015/07/01 Javascript
jQuery实现右下角可缩放大小的层完整实例
2016/06/20 Javascript
详解闭包解决jQuery中AJAX的外部变量问题
2017/02/22 Javascript
微信小程序 跳转方式总结
2017/04/20 Javascript
Vuex 模块化使用详解
2019/07/31 Javascript
vue-cli history模式实现tomcat部署报404的解决方式
2019/09/06 Javascript
ES6之Proxy的get方法详解
2019/10/11 Javascript
js实现数字从零慢慢增加到指定数字示例
2019/11/07 Javascript
jQuery实现全选、反选和不选功能的方法详解
2019/12/04 jQuery
JavaScript实现公告栏上下滚动效果
2020/03/13 Javascript
[50:27]Secret vs VG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
Python中shape计算矩阵的方法示例
2017/04/21 Python
Python入门之三角函数atan2()函数详解
2017/11/08 Python
Python基于pandas实现json格式转换成dataframe的方法
2018/06/22 Python
Python3中详解fabfile的编写
2018/06/24 Python
django框架自定义模板标签(template tag)操作示例
2019/06/24 Python
Python计算机视觉里的IOU计算实例
2020/01/17 Python
13个Pandas实用技巧,助你提高开发效率
2020/08/19 Python
乔丹诺(Giordano)酒庄德国官网:找到最好的意大利葡萄酒
2017/12/28 全球购物
孝老爱亲模范事迹
2014/01/24 职场文书
企业管理培训感言
2014/01/27 职场文书
校园文明倡议书
2014/05/16 职场文书
大学生受助感言
2015/08/01 职场文书
《月球之谜》教学反思
2016/02/20 职场文书
告诉你一个秘密:富人致富的五大优点
2019/07/11 职场文书
Java 中的 Unsafe 魔法类的作用大全
2021/06/26 Java/Android
nginx中封禁ip和允许内网ip访问的实现示例
2022/03/17 Servers
Python绘制散乱的点构成的图的方法
2022/04/21 Python