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 相关文章推荐
动态控制Table的js代码
Mar 07 Javascript
use jscript Create a SQL Server database
Jun 16 Javascript
IE和FireFox(FF)中js和css的不同
Apr 13 Javascript
javascript 面向对象的JavaScript类
May 04 Javascript
基于jquery &amp; json的省市区联动代码
Jun 26 Javascript
IE6下opacity与JQuery的奇妙结合
Mar 01 Javascript
JavaScript实现仿网易通行证表单验证
May 25 Javascript
jQuery+ajax简单实现文件上传的方法
Jun 03 Javascript
AngularJS包括详解及示例代码
Aug 17 Javascript
vuex分模块后,实现获取state的值
Jul 26 Javascript
vue移动端下拉刷新和上滑加载
Oct 27 Javascript
gojs实现蚂蚁线动画效果
Feb 18 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
PHP调用MySQL的存储过程的实现代码
2008/08/12 PHP
ThinkPHP实现支付宝接口功能实例
2014/12/02 PHP
Yii2语言国际化的配置教程
2018/08/19 PHP
PHP7新功能总结
2019/04/14 PHP
Javascript模板技术
2007/04/27 Javascript
JavaScript入门教程(12) js对象化编程
2009/01/31 Javascript
Ext对基本类型的扩展 ext,extjs,format
2010/12/25 Javascript
js 静态动态成员 and 信息的封装和隐藏
2011/05/29 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
2013/11/13 Javascript
js this函数调用无需再次抓获id,name或标签名
2014/03/03 Javascript
node.js中的socket.io入门实例
2014/04/26 Javascript
Mac OS X 系统下安装和部署Egret引擎开发环境
2014/09/03 Javascript
JavaScript中的this,call,apply使用及区别详解
2016/01/29 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
2016/05/27 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
2016/09/04 Javascript
js鼠标跟随运动效果
2017/03/11 Javascript
微信小程序实现聊天室
2020/08/21 Javascript
wxpython学习笔记(推荐查看)
2014/06/09 Python
python安装mysql-python简明笔记(ubuntu环境)
2016/06/25 Python
python 开发的三种运行模式详细介绍
2017/01/18 Python
浅谈Python处理PDF的方法
2017/11/10 Python
利用Anaconda简单安装scrapy框架的方法
2018/06/13 Python
用Python实现二叉树、二叉树非递归遍历及绘制的例子
2019/08/09 Python
Python中pymysql 模块的使用详解
2019/08/12 Python
手机使用python操作图片文件(pydroid3)过程详解
2019/09/25 Python
Django 解决开发自定义抛出异常的问题
2020/05/21 Python
H&M美国官网:欧洲最大的服饰零售商
2016/09/07 全球购物
瑰珀翠美国官网:Crabtree & Evelyn美国
2016/11/29 全球购物
大学毕业通用个人的求职信
2013/12/08 职场文书
《玩具柜台前的孩子》教学反思
2014/02/13 职场文书
小学教师评语大全
2014/04/23 职场文书
医院保洁服务方案
2014/06/11 职场文书
离婚被告代理词
2015/05/23 职场文书
导游词之青城山景区
2019/09/27 职场文书
为什么你写的height:100%不起作用
2021/05/10 HTML / CSS
Java实现添加条码或二维码到Word文档
2022/06/01 Java/Android