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 操作下拉列表框实现代码
Feb 22 Javascript
基于jquery的回到页面顶部按钮
Jun 27 Javascript
JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结
Jun 28 Javascript
JQuery扩展插件Validate 3通过参数设置错误信息
Sep 05 Javascript
jquerymobile checkbox及时刷新才能获取其准确值
Apr 14 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
Aug 07 Javascript
实例讲解JQuery中this和$(this)区别
Dec 08 Javascript
javascript实现的上下无缝滚动效果
Sep 19 Javascript
慕课网题目之js实现抽奖系统功能
Sep 19 Javascript
phantomjs导出html到pdf的方法总结
Oct 19 Javascript
JS手写一个自定义Promise操作示例
Mar 16 Javascript
Vue 数据响应式相关总结
Jan 28 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 set_magic_quotes_runtime() 函数过时解决方法
2010/07/08 PHP
利用PHP生成CSV文件简单示例
2016/12/21 PHP
提高代码性能技巧谈—以创建千行表格为例
2006/07/01 Javascript
鼠标移动到一张图片时变为另一张图片
2006/12/05 Javascript
JavaScript的变量作用域深入理解
2009/10/25 Javascript
JS基础之undefined与null的区别分析
2011/08/08 Javascript
基于jquery实现点击左右按钮图片横向滚动
2013/04/11 Javascript
『jQuery』取指定url格式及分割函数应用
2013/04/22 Javascript
jquery append()方法与html()方法的区别及使用介绍
2014/08/01 Javascript
JavaScript模拟深蓝vs卡斯帕罗夫的国际象棋对局示例
2015/04/22 Javascript
drag-and-drop实现图片浏览器预览
2015/08/06 Javascript
javascript中undefined与null的区别
2015/08/16 Javascript
js钢琴按钮波浪式图片排列效果代码分享
2015/08/26 Javascript
JavaScript function函数种类详解
2016/02/22 Javascript
JS数组排序方法实例分析
2016/12/16 Javascript
Vue之mixin全局的用法详解
2018/08/22 Javascript
Vue实现底部侧边工具栏的实例代码
2018/09/03 Javascript
详解a标签添加onclick事件的几种方式
2019/03/29 Javascript
Python使用django搭建web开发环境
2017/06/09 Python
浅谈python迭代器
2017/11/08 Python
通过Python 接口使用OpenCV的方法
2018/04/02 Python
对python 合并 累加两个dict的实例详解
2019/01/21 Python
python爬虫项目设置一个中断重连的程序的实现
2019/07/26 Python
python中68个内置函数的总结与介绍
2020/02/24 Python
HTML5 文件域+FileReader 分段读取文件并上传到服务器
2017/10/23 HTML / CSS
Nisbets法国:英国最大的厨房和餐饮设备供应商
2019/03/18 全球购物
加拿大的标志性百货公司:Hudson’s Bay(哈得逊湾)
2019/09/03 全球购物
struct和class的区别
2015/11/20 面试题
优秀导游先进事迹材料
2014/01/25 职场文书
小松树教学反思
2014/02/11 职场文书
省文明单位申报材料
2014/05/08 职场文书
酒店辞职书范文
2015/02/26 职场文书
酒会开场白大全
2015/06/01 职场文书
毕业论文答辩演讲稿
2015/06/23 职场文书
java协程框架quasar和kotlin中的协程对比分析
2022/02/24 Java/Android
不想升级Win11?教你彻底锁定老版Windows系统的方法(附下载地址)
2022/09/23 数码科技