JS按回车键实现登录的方法


Posted in Javascript onAugust 25, 2014

本文实例讲述了JS按回车键实现登录的方法,该功能有着非常广泛的实用价值。分享给大家供大家参考之用。具体方法如下:

方法一:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Check Score</title>
<script language="JavaScript">
function keyLogin(){
 if (event.keyCode==13)  //回车键的键值为13
   document.getElementByIdx_x("input1").click(); //调用登录按钮的登录事件
}
</script>
</head>
<body onkeydown="keyLogin();">
<input id="input1" value="登录" type="button" onClick="alert('调用成功!')">
</body>
</html>

方法二:

<script>
function KeyDown()
{
  if (event.keyCode == 13)
  {
    event.returnValue=false;
    event.cancel = true;
    Form1.btnsubmit.click();
  }
}
</script>

使用方法:

<form name="Form1" method="">
用户名:<INPUT TYPE=text SIZE=20 maxlength = 8 onkeydown=KeyDown()>
密码:<INPUT TYPE=password SIZE=20 maxlength = 8 onkeydown=KeyDown()>
<input type="submit" name="btnsubmit" value="提交" />
</form>

方法三:

任何一个网站页面都有登陆界面,很多时候在输入好用户名和密码后,还要用鼠标去点一个类似于登陆什么的按钮或者链接.这样你才能进网站做你喜欢做的事情.
有时候我就在想是不是能在输入好我该输入的东西后,直接敲回车就执行登陆功能呢?解决方法如下:

ss.html页面代码:

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="css/text.css" type="text/css">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onkeydown="on_return();">
  <form name ="loginForm" method="post" action="fuck.html">        
   <table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td width="69%" height="30"><span class="font_04">帐户名</span>
  <input type="text" name="userName" size="18.5">
 </td>
    </tr>
    <tr>
 <td width="69%" height="30"><span class="font_04">密 码</span>
  <input type="password" name="pwd" >
 </td>
    </tr>
    <tr>
 <td width="31%" height="30">
 <a id="sub" onClick='check()' >
 登陆</a></td>
    </tr>
   </table>
  </form>
</body>
</html>
<script language="javascript">
function check() {
    var formname=document.loginForm;
   if (formname.userName.value == "") {
    alert("请输入用户名!");
    formname.userName.focus();
    return false;
  }
  if (formname.pwd.value == "") {
    alert("请输入密码!");
    formname.pwd.focus();
    return false;
  }
  formname.submit();
}
  //回车时,默认是登陆
 function on_return(){
 if(window.event.keyCode == 13){
  if (document.all('sub')!=null){
   document.all('sub').click();
   }
 }
 }
</script>

此处注意:在<body>里面我们加了onkeydown属性,这样我们输入好内容后按键就可以直接执行JS方法on_return()了.因为window.event.keyCode 如果是13的话,表示回车键,所以我们判断我们按的键是不是回车键,如果是我们就去找'sub'属性,假如找到了执行click方法就是了。

希望本文所述方法对大家的web程序设计有所帮助。

Javascript 相关文章推荐
浅析jQuery中常用的元素查找方法总结
Jul 04 Javascript
一系列Bootstrap导航条使用方法分享
Apr 29 Javascript
使用jquery获取url及url参数的简单实例
Jun 14 Javascript
自制微信公众号一键排版工具
Sep 22 Javascript
微信小程序 教程之WXML
Oct 18 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
使用Math.max,Math.min获取数组中的最值实例
Apr 25 Javascript
JS动态插入脚本和插入引用外部链接脚本的方法
May 21 Javascript
Vuex中的State使用介绍
Jan 19 Javascript
Vue如何基于vue-i18n实现多国语言兼容
Jul 17 Javascript
javascript实现图片轮换动作方法
Aug 07 Javascript
JavaScript实现世界各地时间显示
Sep 07 Javascript
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 #Javascript
一个支持任意尺寸的图片上下左右滑动效果
Aug 24 #Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 #Javascript
在JS数组特定索引处指定位置插入元素的技巧
Aug 24 #Javascript
js获取checkbox复选框选中的选项实例
Aug 24 #Javascript
jQuery异步加载数据并添加事件示例
Aug 24 #Javascript
Jquery通过JSON字符串创建JSON对象
Aug 24 #Javascript
You might like
VFP与其他应用程序的集成
2006/10/09 PHP
Linux fgetcsv取得的数组元素为空字符串的解决方法
2011/11/25 PHP
php调用方法mssql_fetch_row、mssql_fetch_array、mssql_fetch_assoc和mssql_fetch_objcect读取数据的区别
2012/08/08 PHP
php让json_encode不自动转义斜杠“/”的方法
2020/04/27 PHP
PHP获取php,mysql,apche的版本信息及更多服务器信息
2021/03/09 PHP
IE7中javascript操作CheckBox的checked=true不打勾的解决方法
2009/12/07 Javascript
javascript 图片上一张下一张链接效果代码
2010/03/12 Javascript
js调用activeX获取u盘序列号的代码
2011/11/21 Javascript
js 处理数组重复元素示例代码
2013/12/27 Javascript
实例讲解Jquery中隐藏hide、显示show、切换toggle的用法
2016/05/13 Javascript
jQuery each函数源码分析
2016/05/25 Javascript
JavaScript 节流函数 Throttle 详解
2016/07/04 Javascript
jquery使用EasyUI Tree异步加载JSON数据(生成树)
2017/02/11 Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
2017/08/18 jQuery
vue中axios解决跨域问题和拦截器的使用方法
2018/03/07 Javascript
js实现ATM机存取款功能
2020/10/27 Javascript
详解vue2.0模拟后台json数据
2019/05/16 Javascript
vue实现日历备忘录功能
2020/09/24 Javascript
通过vue写一个瀑布流插件代码实例
2019/09/07 Javascript
WebPack工具运行原理及入门教程
2020/12/02 Javascript
python实现图片筛选程序
2018/10/24 Python
Python类中的魔法方法之 __slots__原理解析
2019/08/26 Python
python标准库os库的函数介绍
2020/02/12 Python
Python标准库:内置函数max(iterable, *[, key, default])说明
2020/04/25 Python
python用Configobj模块读取配置文件
2020/09/26 Python
python smtplib发送多个email联系人的实现
2020/10/09 Python
解决python3.x安装numpy成功但import出错的问题
2020/11/17 Python
咖啡为什么会有酸味?你喝到的咖啡為什麼是酸的?
2021/03/17 冲泡冲煮
canvas学习和滤镜实现代码
2018/08/22 HTML / CSS
中专生毕业自我鉴定
2013/11/01 职场文书
环保倡议书100字
2014/05/15 职场文书
专项法律服务方案
2014/06/11 职场文书
小学安全汇报材料
2014/08/14 职场文书
大专毕业生自我鉴定范文(2篇)
2014/09/27 职场文书
2015年部门工作总结范文
2015/03/31 职场文书
教你怎么用python selenium实现自动化测试
2021/05/27 Python