Js监控回车事件
标题通俗的说，也就是绑定当用户按下回车键要执行的事件。
下面，入正题。
第一步，先编写简单的页面代码，这里我们只需要一个按钮就足够了。当然，还有按钮事件。 <html>
<head>
<title>测试绑定enter</title>
<script type="text/javascript">
function b_onclick() { alert("你好！"); }
</script>
</head>
<body>
<input type="button" value="测试按钮" id="test" onclick="b_onclick()" /> </body>
</html>
第二步，于b_onclick()函数加入如下js代码：
function document.onkeydown()
{ //使用document.getElementById获取到按钮对象
var button = document.getElementById("test");
if(event.keyCode == 13)
{
button.click();
event.returnValue = false;
}
}
然后于IE中运行，你会发现，即使焦点不在按钮上，当你按下回车，依然执行了按钮的函数。稍微解释一下代码： event.keyCode == 13是判断按下的是那一个间，13代表的是回车键。 button.click();执行按钮事件。 event.returnValue = false;这个是为了防止浏览器捕捉到用户按下回车键而进行其他操作。例如假如输入框中，没有这行代码的话，在执行完按钮事件后，其还会执行换行的动作。第三步，很多人都认为做完上面的工作已经完成了整个作业。其实不是的。你尝试使用firefox浏览，就会发现，代码并不会执行。显然，这是因为firefox不支持event事件对象。为了做到跨浏览器，不得不将代码进行优化。我们可以这个做：
首先，为boby添加一个onkeydown监控函数，如<body onkeydown="BindEnter(event)">。其次修改原来的绑定函数为：
function BindEnter(obj)
{ //使用document.getElementById获取到按钮对象
var button = document.getElementById('test');
if(obj.keyCode == 13)
{
button.click();
obj.returnValue = false;
}
} 为什么要将事件对象作为参数传递呢？这是为了避免进行浏览器判别，节省代码。 OK，到这里已经基本完成了。完整代码如下：
<html>
<head>
<title>测试绑定enter</title>
<script type="text/javascript"> function b_onclick() { alert("你好！"); } function BindEnter(obj) {
//使用document.getElementById获取到按钮对象
var button = document.getElementById('test');
if(obj.keyCode == 13)
{ button.click();
obj.returnValue = false;
}
}
</script>
</head>
<body onkeydown="BindEnter(event)">
<input type="button" value="测试按钮" id="test" onclick="b_onclick()" /> </body> </html>
Js监控回车事件的更多相关文章
- JS获取回车事件（兼容各浏览器）
一.用到onkeydown获取事件动作, 二.用到键盘对应代码keyCode, 三. var event=arguments.callee.caller.arguments[0]||window.ev ...
- js捕获回车事件，并且获取每一条输入内容
<body> <div style="width: 200px; height: 20px;"> <textarea id="inputVa ...
- js 设置回车事件
document.onkeydown=function(event){ var e = event || window.event || arguments.callee.caller.argumen ...
- js按回车事件提交
$(document).keyup(function (event) { if (event.keyCode == "13") { document.getElementById( ...
- easyui-combobox绑定回车事件注意事项
回车事件的定义的位置必须是easyui-combobox数据加载的后面,才有效果. HTML文件: <select id="aucBrandNo" class="e ...
- 兼容IE与firefox火狐的回车事件(js与jquery)
javascript 兼容IE与firefox火狐的回车事件 复制代码代码如下: <script language="javascript"> function key ...
- js 监听整个页面的回车事件
JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch; ...
- 原 JS监听回车事件
原 JS监听回车事件 发表于2年前(2014-06-04 10:16) 阅读(6101) | 评论(0) 11人收藏此文章, 我要收藏 赞0 1月16日厦门 OSC 源创会火热报名中,奖品多多哦 ...
- js登录页面的 回车事件
js登录页面的 回车事件 js登录页面的 回车事件(2012-12-26 10:37:03)转载▼标签: jseventkey回车事件登录 分类: js.jquery //回车事件 第一种docum ...
随机推荐
- 《University Calculus》-chape4-导数的应用-洛必达法则
在求解极限的时候,我们常会遇到0/0型的不定式而无法进一步的求解极限,而洛必达法则就是用于处理这样的特定情况. 洛必达法则: 其证明过程要基于柯西中值定理(在该专栏的微分中值定理中给出). 证明:
- hdu-1272 并查集
Problem Description 上次Gardon的迷宫城堡小希玩了很久(见Problem B),现在她也想设计一个迷宫让Gardon来走.但是她设计迷宫的思路不一样,首先她认为所有的通道都应该 ...
- Demon_动画控制（实现前后左右移动，喊叫）
using UnityEngine; using System.Collections; public class PlayerAnimation : MonoBehaviour { float ve ...
- Android 网络框架---Volley
/** * Volley 可以同时请求多个,允许高并发 * 特性: * 1.JSON.图片等的异步下载 * 2.网络请求的排序(Scheduling) * 3.网络请求的优先级处理 * 4.缓存 * ...
- Android Dialog透明度和暗度
1.设置透明度(Dialog自身的透明度)WindowManager.LayoutParams lp=dialog.getWindow().getAttributes(); lp.alpha=1.0f ...
- XP的定时关机命令？
Windows XP的关机是由Shutdown.exe程序来控制的,位于Windows/System32文件夹中.如 果想让Windows 2000也实现相同的效果,能够把Shutdown.exe拷贝 ...
- 在Eclipse中使用JUnit4进行单元測试（0基础篇）
本文绝大部分内容引自这篇文章: http://www.devx.com/Java/Article/31983/0/page/1 我们在编写大型程序的时候,须要写成千上万个方法或函数,这些函数的功能可能 ...
- [转] Maven镜像配置
参考:许晓斌的<Maven实战> 镜像是为了提供更快的服务 如图:X就认为是Y的一个镜像. 编辑settings.xml配置中央仓库镜像: <settings> ... < ...
- C/C++笔试题整理
1. C的结构体和C++结构体的区别 (1)C的结构体内不允许有函数存在,C++允许有内部成员函数,且允许该函数是虚函数.所以C的结构体是没有构造函数.析构函数.和this指针的. (2)C的结构体对 ...
- Java基础知识强化之IO流笔记10：File类输出指定目录下指定后缀名的文件名称案例（File类的文件过滤器方法改进list（ FilenameFilter ff））
1. 案例: 判断F盘下是否有后缀名为.jpg的文件,如果有的话,就输出这个文件名. 2. 案例代码如下: (1)思路是:先获取所有的文件和文件夹封装的对象,然后遍历的时候,依次判断,如果满足条件就输 ...