onkeydown事件实现回车提交与键盘输入限制
作者:像素猫时间:2026-10-27 09:14:07浏览:104
本文介绍如何利用onkeydown事件处理键盘按键,实现用户按下回车键自动提交表单的功能。通过区分IE的keyCode与Netscape/Firefox的which属性,确保跨浏览器兼容。同时提供示例代码,演示如何拦截输入框中的数字键入,以增强表单输入的灵活性与控制力。
onkeydown事件实现回车提交与键盘输入限制
在登录页面开发中,常需捕捉用户按下回车键时自动提交数据的交互需求。
具体做法是在body标签内添加onkeydown事件,通过JavaScript脚本处理表单提交逻辑。
查找文档如下
onkeydown事件会在用户按下键盘上的任意按键时触发。
其基本语法格式为:onkeydown="SomeJavaScriptCode"。
支持该事件的html标签;
以下是支持该事件的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
}
keychar = String.fromCharCode(keynum)
numcheck = /\d/
return !numcheck.test(keychar)
}
</script>
<form>
<input type="text" onkeydown="return noNumbers(event)" />
</form>
</html>作者最新文章
js-cookie 安装与基础用法:set、get、remove 详解
2026-11-05 16:35:06
适合JavaScript初学者的实战项目:制作简易待办事项列表
2026-11-05 16:17:07
JS打开新标签页时怎么通过URL传递参数
2026-11-05 12:21:08
sigma.js 自定义节点样式:设置颜色、大小及标签显示的技巧
2026-11-05 09:55:00
JS 生成的统计图怎么导出为 PNG 图片或 PDF 文件?
2026-11-05 09:37:58
