不得不说，在JS方面，自己真的是个不折不扣的菜鸟。对于JS以及一些JS框架如JQuery等JS框架，自己也只是处在简单应用的阶段，当然自己也在不断的学习当中，希望将来能跟大家分享更多JS方面的心得。今天先来点开胃的，说一下如何设置一个默认按钮，就是不管焦点在不在按钮上，只要按下回车，就等于触发了按钮的单击事件。

代码非常简单，要完成这个功能，只需几行代码：

    //为keyListener方法注册按键事件

    document.onkeydown=keyListener; 

    function keyListener(e){ 

        //    当按下回车键，执行我们的代码

        if(e.keyCode == 13){ 

            //我们要做的事情

        } 

    }

额，貌似有点太简单了，就这样完成一篇博客，我都有点不好意思了。最后为大家附上一个小程序的实例吧：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>计算器</title>

        <script type="text/javascript" >

            function calculate() {

                var a = document.getElementById("pre-tax").value;

                if (parseInt(a)>8000) {

                    document.getElementById("interest").value =800+ (a - 8000)*15/100;

                } else {

                    document.getElementById("interest").value =a/10;

                }

            }

            //为keyListener方法注册按键事件

            document.onkeydown=keyListener; 

            function keyListener(e){ 

                //    当按下回车键，执行我们的代码

                if(e.keyCode == 13){ 

                    calculate();

                } 

            }

        </script>

    </head>

    <body >

        税前薪资：<input type="text" id="pre-tax"/>

        <input type="button" id="calculate" value="计算" onclick="calculate()"/>

        利息：<input type="text" id="interest" readonly="readonly"/>

    </body>

</html>

这个小实例很简单，代码很好懂，但是代码背后的东西不是一般人能懂的。看懂的请举手.....

菜鸟学JS（四）——javascript为按钮注册回车事件（设置默认按钮）的更多相关文章

  1. 重学js之JavaScript 面向对象的程序设计（创建对象）

    注意: 本文章为 <重学js之JavaScript高级程序设计>系列第五章[JavaScript引用类型]. 关于<重学js之JavaScript高级程序设计>是重新回顾js基 ...

  2. JS如何调用隐藏按钮的click事件

    js如何调用隐藏按钮的click事件:1.设定隐藏不要使用Visiable属性,使用style.display=none:2.触发JS事件可以使用fireEvent方法,如:document.getE ...

  3. js 监听整个页面的回车事件

    JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;      ...

  4. 新手怎么学JS？JavaScript基础入门

    新手应该怎么学习JS?JavaScript入门 - 01 准备工作 在正式的学习JavaScript之前,我们先来学习一些小工具,帮助我们更好的学习和理解后面的内容. js代码位置 首先是如何编写Ja ...

  5. js和jquery触发按钮点击事件

    js触发按钮点击事件 function load(){ //下面两种方法效果是一样的 document.getElementById("target").onclick(); do ...

  6. 菜鸟学JS（三）——自动隐藏的悬浮框

    今天写一个小实例,用js和css写一个可以自动隐藏的悬浮框.css肯定是用来控制样式的,js用来控制器显示与隐藏的.显示与隐藏通常有两种方法实现:1,用js控制其显示属性:2,用js控制其大小. 今天 ...

  7. 菜鸟学JS（五）——window.onload与$(document).ready()

    我们继续说JS,我们常常在页面加载完成以后做一些操作,比如一些元素的显示与隐藏.一些动画效果.我们通常有两种方法来完成这个事情,一个就是window.onload事件,另一个就是JQuery的read ...

  8. 菜鸟学Windows Phone 8开发(3)——布局和事件基础

    本系列文章来源MSDN的 面向完全新手的 Windows Phone 8 开发  本文地址:http://channel9.msdn.com/Series/Windows-Phone-8-Develo ...

  9. 给button按钮加回车事件

    <button class="login-btn" id="login">立即登录</button> $("body" ...

随机推荐

  1. Capistrano初探--Ruby快速部署工具

    1.Capistrano介绍 是什么?---一种部署工具.(部署就是在生产服务器上安装应用程序,或是更新最新版本:web服务器的启动重启与停止:使网站进入维护状态或将其恢复为常态) 在进行 Rails ...

  2. PHP header函数使用教程

    在php语言中,header()这个函数很有用的,尤其在用到ajax时候,他会帮你解决一些意想不到的问题.下面是header的一些详细讲解.希望对phper有帮助 代码如下: <?php// f ...

  3. split(),preg_split()与explode()函数分析与介

    split(),preg_split()与explode()函数分析与介 发布时间:2013-06-01 18:32:45   来源:尔玉毕业设计   评论:0 点击:965 split()函数可以实 ...

  4. iOS开发证书"此证书的签发者无效"解决方法

    前言 哎,每次过完节都要有一个坑给自己跳.逃不过这个魔爪.这不,一过完春节,回来就发现公司证书出现"此证书的签发者无效". 问题原因 经过一番查找,苹果官方给出了回答. Thank ...

  5. [ASE][Daily Scrum]11.24

    今天开会总结了一下第一周的进度,讨论了无限地图的访存方法,做了简单的人员调整, Client的包接收分析与服务器通信这块基本上完成了, 之后Jiafan Zhu会开始和Junbei以及Songtao一 ...

  6. linux基本命令--学习记录

    1.mkdir -p 递归创建目录(-p参数代表递归创建): 2.touch 创建file: 3.cat 查看 5.vi 编辑器 6.echo >(直接覆盖) 或者<<(后面追加)单 ...

  7. CoreCLR中超过3万行代码的gc.cpp文件的来源

    在CoreCLR的开源代码中,GC的主要实现代码gc.cpp文件大小竟然有1.17MB,打开文件一看,竟然有35490行!第一次见到如此多行的单个代码文件. github都不让直接查看:https:/ ...

  8. Hive的安装部署

    1.环境准备 1.1软件版本 hive-0.14 下载地址 2.配置 安装hive的前提,必需安装好hadoop环境,可以参考我之前Hadoop社区版搭建,先搭建好hadoop环境:接下来我们开始配置 ...

  9. [ACM_图论] 棋盘问题 （棋盘上放棋子的方案数）

    不能同行同列,给定形状和大小的棋盘,求摆放k个棋子的可行方案 Input 2表示是2X2的棋盘,1表示k,#表示可放,点不可放(-1 -1 结束) Output 输出摆放的方案数目C Sample I ...

  10. 【原】在windows下使用VirtualEnv

    VirtualEnv可以方便的解决不同项目中对类库的依赖问题.这通常是通过以下方式实现的:首先将常用的类库安装在系统环境中:然后为每个项目安装独立的类库环境.这样子可以保证每个项目都运行在独立的类库环 ...