第一步,先编写简单的页面代码,这里我们只需要一个按钮就足够了。当然,还有按钮事件。
<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>

asp.net中用回车代替按钮事件的更多相关文章

  1. ASP.NET多个Button的页面,回车执行按钮事件(转)

    主要有两种实现方法分别是:JavaScript的方法与Panel的方法 一.JavaScript的方法 ①单输入框(文本框)单按钮的实现方法 以下功能实现:在输入框中输入内容之后,按回车键就执行按钮事 ...

  2. c#窗体获取系统时间、回车触发按钮事件、实现验证码功能

    1.窗体上显示时间: 1)首先新建一个Timer,命名为timer,并在属性中修改Interval为1000: 2)在需要显示时间的地方添加一个label(假设设置名称为:timerLabel): 3 ...

  3. input输入框,回车激活按钮事件代码

    <input type="text" name="输入框ID" id="输入框ID" onkeypress="if(even ...

  4. asp.net中TextBox里面实现回车触发指定事件

    原文:asp.net中TextBox里面实现回车触发指定事件 我在一个user_top用户控件里面做了个包括搜索的功能.然后再一个页面中添加这个用户控件.浏览时候在textbox里面输入搜索内容后.下 ...

  5. asp.net中父子页面通过gridview中的按钮事件进行回传值的问题

    这两天写BS程序,遇到父子页面传值的问题,以前没写过web系统,用了几天时间才将问题解决,总结下记录下来: 问题描述: 父页面A中有一个gridview,每行6个列,有5列中均有一个按钮,单击按钮,会 ...

  6. ASP.NET 中的返回按钮的实现【转】

      返回上一页的这个东东在我们做项目的时候一般是用于填写完表单后确认的时候,有对原来输入的数据进行修改时用的,或者是因为网站为了方便浏览者而有心添加 的一个东东,一般这种功能的实现在ASP.net中都 ...

  7. jQuery实现回车绑定Tab事件

    有时候我们希望回车事件绑定的是键盘的Tab事件.我的第一思路就是切换事件的keyCode,比如键盘事件按下的keyCode如果是13,我们将keyCode改为9.但是在实际编程中却未能实现此效果.于是 ...

  8. asp.net中用cookie记住密码上次不用登陆

    ------最佳解决方案--------------------写入CookieResponse.Cookies["UserName"].Value = "用户名&quo ...

  9. ngui中 代码调用按钮事件(后来改成了按钮绑定键盘..)

    ngui中 代码调用按钮事件 好烦人啊这个问题, 我弄完发上来 这个问题解决了一半 发现可以用 按钮绑定来解决这个问题,并且更安全方便快速 直接在按钮上添加一个 key binding 指定按键 搞定 ...

随机推荐

  1. Java NIO类库Selector机制解析(上)

    一.  前言 自从J2SE 1.4版本以来,JDK发布了全新的I/O类库,简称NIO,其不但引入了全新的高效的I/O机制,同时,也引入了多路复用的异步模式.NIO的包中主要包含了这样几种抽象数据类型: ...

  2. VC中监测函数运行时间

    VC++编程时,经常会监控某个算法的计算时间,以确定算法的效率.编码举例如下, //========start: algorithm time============= // SYSTEMTIME s ...

  3. python的random模块

    As an example of subclassing, the random module provides the WichmannHill class that implements an a ...

  4. Python requests模块

    import requests 下面就可以使用神奇的requests模块了! 1.向网页发送数据 >>> payload = {'key1': 'value1', 'key2': [ ...

  5. 解决用Eclipse开发Android程序时不能生成R.java的问题

    今天我照着Mars老师的视频教程开始学习Android程序开发. 但是,我的Eclipse死活不能生成R.java文件,新建的工程也不行. 然后我百度,百度出来的结果一般是说这样解决: 1.clean ...

  6. java web servlet

    一.什么是Servlet Servlet是一种小型的Java程序,它扩展了Web服务器的功能.作为一种服务器端的应用,他是运行在Servlet容器当中,例如Tomcat就是一种流行的Servlet容器 ...

  7. SkinSharp用法

    SkinSharp又称Skin#,是很好用的一款轻量化的VC程序美化工具 官网地址是http://www.skinsharp.com/ 尽管SkinSharp是收费软件,但提供试用版,并且比較厚道,试 ...

  8. java 对象序列化

    java 对象序列化 package org.rui.io.serializable; import java.io.ByteArrayInputStream; import java.io.Byte ...

  9. oc-09-#pragma mark指令的使用,用于查找代码

    // 3-[了解]#pragma mark指令的使用,用于查找代码. #import <Foundation/Foundation.h> //声明一个狗类 #pragma mark 声明狗 ...

  10. Hadoop发展历史简介

    简介 本篇文章主要介绍了Hadoop系统的发展历史以及商业化现状, 科普文. 如果你喜欢本博客,请点此查看本博客所有文章:http://www.cnblogs.com/xuanku/p/index.h ...