2.2  按Enter键调用登录按钮

【实例描述】

为了方便用户操作，在登录邮箱或论坛时，如果用户输入了用户名和密码，按Enter键时，都会自动调用登录按钮。本例学习如何实现此功能。

【实现代码】

  1. <html xmlns="http://www.w3.org/1999/xhtml" >
  2. <head>
  3. <title>Check Score</title>
  4. <script language="JavaScript">
  5. function keyLogin(){
  6. if (event.keyCode==13)                          //按Enter键的键值为13
  7. document.getElementById("input1").click();  //调用登录按钮的登录事件
  8. }
  9. </script>
  10. </head>
  11. <body onkeydown="keyLogin();">
  12. <input id="input1" value="登录" type="button"  onclick="alert('调用成功！')">
  13. </body>
  14. </body>
  15. </html>

【运行效果】

按Enter键后的效果如图2-1所示。

 
图2-1  按Enter键后的效果

【难点剖析】

本例的重点是如何判断用户敲击的是Enter键，这通过判断键值"keyCode"实现，"Enter"的键值为13。使用"getElementById"方法，通过按钮的ID找到页面中的"登录"按钮，然后直接调用其"click"方法即可。

Enter直接登录的更多相关文章

  1. 系统开发中按下Enter键登录系统

    转载来自:http://www.jb51.net/article/54308.htm 系统开发中按下Enter键登录系统,即就是监听键盘,当按下Enter键后调用登录按钮的click()事件. JS方 ...

  2. enter 键登录的实现

    js 代码 document.onkeypress = function() { var iKeyCode = -1; if (arguments[0]) { iKeyCode = arguments ...

  3. vue中Enter触发登录事件和javascript中Enter触发点击事件

    created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...

  4. 登录时 按Enter 进入登录界面 或者下一行

    function keyLogin() { if (event.keyCode == 13) //回车键的键值为13 $(".btn-submit").click(); //调用登 ...

  5. JSP登录页面使用Enter键登录【转】

    按回车键实现登录   第一种方法:        <html xmlns="http://www.w3.org/1999/xhtml" ><head>  & ...

  6. JS实现登录页面记住密码和enter键登录

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>按 ...

  7. jQuery实现enter键登录

    在登录时,使用快捷键登录时常用的方法,其中 loginReq()方法为请求登录检索的方法 $("#login").click(function(){ loginReq(); }); ...

  8. jQuery实现按enter键登录

    <script> $(document).keydown(function (event) { if (event.keyCode == 13) { $("#btn_Login& ...

  9. Enter键登录

    <div class="zhuce_input_ty"> <p><a id="qianlogin" onclick="U ...

随机推荐

  1. win7 vmware 无法使用usb

    只有在win7下才会有这个问题,在xp下没有. 原因是: win7的主机上禁用了vmare usb arbitration(仲裁) service. 在主机上启用这个服务 重启即可. 如果无法启用vm ...

  2. jquery中$.ajax

    $.ajax({ type : 'post', url : '/edm/testEmail.php', data: {tId:tId, sId:sId ,testEmail:testEmail}, d ...

  3. JS代码的加载

    HTML页面中JS的加载原理:在加载HTML页面的时候,当浏览器遇到内嵌的JS代码时会停止处理页面,先执行JS代码,然后再继续解析和渲染页面.同样的情况也发生在外链的JS文件中,浏览器必须先花时间下载 ...

  4. 字符串模拟赛T2

    // source code from laekov for c0x17 #define PRID "fkqh" #include <cstdio> #include ...

  5. zstu.4022.旋转数阵(模拟）

    旋转数阵 Time Limit: 1 Sec  Memory Limit: 64 MB Submit: 1477  Solved: 102 Description 把1到n2的正整数从左上角开始由外层 ...

  6. UITableview reloadData Animation 动画效果

    http://blog.kingiol.com/blog/2013/10/22/uitableview-reloaddata-with-animation/ 运用到UITableview进行重新加载数 ...

  7. Kruskal vs Borůvka

    做了个对比.Borůvka算法对于稠密图效果特别好.这两个都是求生成森林的算法.Prim+heap+tarjan过于难写不写了. V=200,E=1000 Kruskal method 4875048 ...

  8. HXOI 2014 PSet 4 Day 1 一模04日1 题解

    1. 最小花费(money.pas/c/cpp) 问题描述 在n个人中,某些人的银行账号之间可以互相转账.这些人之间转账的手续费各不相同.给定这些人之间转账时需要从转账金额里扣除百分之几的手续费,请问 ...

  9. Python列表的remove方法的注意事项

    为何没有删除列表中的全部元素? 解释: 按照执行顺序,第一个空格被删除之后,后面的元素会前移(变成['空格','空格','12','23']),指针下一次会指向新列表的第二个元素(即初始状态的第三个空 ...

  10. LVS-三种负载均衡方式比较

    1.什么是LVS? 首 先简单介绍一下LVS (Linux Virtual Server)到底是什么东西,其实它是一种集群(Cluster)技术,采用IP负载均衡技术和 基于内容请求分发技术.调度器具 ...