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 相关文章推荐
jquery 插件开发方法小结
Oct 23 Javascript
js获取光标位置和设置文本框光标位置示例代码
Jan 09 Javascript
javascript常见操作汇总
Sep 03 Javascript
jQuery.position()方法获取不到值的安全替换方法
Mar 13 Javascript
jQuery实现购物车数字加减效果
Mar 14 Javascript
JavaScript获取表单内所有元素值的方法
Apr 02 Javascript
JavaScript+CSS实现仿Mootools竖排弹性动画菜单效果
Oct 14 Javascript
基于javascript实现浏览器滚动条快到底部时自动加载数据
Nov 30 Javascript
angularJs关于指令的一些冷门属性详解
Oct 24 Javascript
JS实现页面内跳转的简单代码
Sep 03 Javascript
layui实现下拉框三级联动
Jul 26 Javascript
详解Vue 的异常处理机制
Nov 30 Vue.js
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的5个入手程序
2006/11/23 PHP
用C/C++扩展你的PHP 为你的php增加功能
2012/09/06 PHP
小谈php正则提取图片地址
2014/03/27 PHP
如何使用php等比例缩放图片
2016/10/12 PHP
php实现支付宝当面付(扫码支付)功能
2018/05/30 PHP
javascript最常用与实用的创建类的代码
2010/08/12 Javascript
js支持键盘控制的左右切换立体式图片轮播效果代码分享
2015/08/26 Javascript
jQuery中事件与动画的总结分享
2016/05/24 Javascript
Active控件问题小结(附解决办法)
2016/06/09 Javascript
理解JavaScript原型链
2016/10/25 Javascript
Node.js和Express简单入门介绍
2017/03/24 Javascript
LayUI动态设置checkbox不显示的解决方法
2019/09/02 Javascript
小程序自定义弹框效果
2020/11/16 Javascript
[01:39:04]DOTA2-DPC中国联赛 正赛 SAG vs CDEC BO3 第二场 2月1日
2021/03/11 DOTA
python通过openpyxl生成Excel文件的方法
2015/05/12 Python
Python简单读取json文件功能示例
2017/11/30 Python
基于Django URL传参 FORM表单传数据 get post的用法实例
2018/05/28 Python
python retrying模块的使用方法详解
2019/09/25 Python
如何在python中执行另一个py文件
2020/04/30 Python
python实现计算器简易版
2020/12/17 Python
plt.figure()参数使用详解及运行演示
2021/01/08 Python
Pytorch - TORCH.NN.INIT 参数初始化的操作
2021/02/27 Python
基于CSS3实现的黑色个性导航菜单效果
2015/09/14 HTML / CSS
探究 canvas 绘图中撤销(undo)功能的实现方式详解
2018/05/17 HTML / CSS
法国时尚品牌乐都特瑞士站:La Redoute瑞士
2016/09/05 全球购物
奥兰多迪士尼门票折扣:Undercover Tourist
2018/07/09 全球购物
简述Linux文件系统通过i节点把文件的逻辑结构和物理结构转换的工作过程
2012/04/17 面试题
DTD的含义以及作用
2014/01/26 面试题
文明好少年事迹材料
2014/08/19 职场文书
镇党政领导班子民主生活会思想汇报
2014/10/11 职场文书
自书遗嘱范文
2015/08/07 职场文书
2019幼儿园感恩节活动策划书
2019/11/28 职场文书
python 自动化偷懒的四个实用操作
2021/04/11 Python
vue自定义右键菜单之全局实现
2022/04/09 Vue.js
python创建字典及相关管理操作
2022/04/13 Python
mysql 体系结构和存储引擎介绍
2022/05/06 MySQL