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

最新推荐文章于 2020-04-27 16:28:23 发布
最新推荐文章于 2020-04-27 16:28:23 发布
阅读量883 收藏
点赞数
分类专栏： 脚本语言

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

投稿：shichen2014 字体：[ 增加  减小] 类型：转载
这篇文章主要介绍了JS按回车键实现登录的方法,在web程序设计中非常实用的技巧,可用于表单提交的情况,具有很好的用户体验,需要的朋友可以参考下
id="cproIframe_u1892994_2" width="580" height="90" src="http://pos.baidu.com/acom?adn=3&at=231&aurl=&cad=1&ccd=24&cec=GBK&cfv=18&ch=0&col=zh-CN&conBW=0&conOP=1&cpa=1&dai=2&dis=0&ltr=https%3A%2F%2Fwww.google.com%2F&ltu=http%3A%2F%2Fwww.jb51.net%2Farticle%2F54308.htm&lu_161=0&lunum=6&n=jb51_cpr&pcs=1903x971&pis=10000x10000&ps=426x486&psr=1920x1080&pss=1903x427&qn=ac40649ad75c81bd&rad=&rsi0=580&rsi1=90&rsi5=4&rss0=%23FFFFFF&rss1=%23F7FCFF&rss2=%230000ff&rss3=%23444444&rss4=%23008000&rss5=&rss6=%23e10900&rss7=&scale=&skin=tabcloud_skin_3&stid=5&td_id=1892994&titFF=%E5%AE%8B%E4%BD%93&titFS=12&titTA=left&tn=text_default_580_90&tpr=1438077106436&ts=1&version=2.0&xuanting=0&dtm=BAIDU_DUP2_SETJSONADSLOT&dc=2&di=u1892994&ti=JS%E6%8C%89%E5%9B%9E%E8%BD%A6%E9%94%AE%E5%AE%9E%E7%8E%B0%E7%99%BB%E5%BD%95%E7%9A%84%E6%96%B9%E6%B3%95_javascript%E6%8A%80%E5%B7%A7_%E8%84%9A%E6%9C%AC%E4%B9%8B%E5%AE%B6&tt=1438077106412.134.318.329" align="center,center" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" allowtransparency="true">

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

方法一：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
< 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 >

方法二：

?
1
2
3
4
5
6
7
8
9
10
11
<script>
function KeyDown()
{
   if (event.keyCode == 13)
   {
     event.returnValue= false ;
     event.cancel = true ;
     Form1.btnsubmit.click();
   }
}
</script>

使用方法：

?
1
2
3
4
5
< 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页面代码:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
< 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程序设计有所帮助。

jfkidear
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript实现回车键提交表单方法总结
10-24
主要介绍了javascript实现回车键提交表单方法,实例总结了纯javascript与jQuery的实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
JS按回车键实现登录
孤独的大佬
06-10 1351
一、html部分 <-- 在页面任何一个地方敲回车都要实现，所以给body一个键盘按下事件 --> <body onkeydown="keyLogin()"> <button id="loginBtn" type="button" onclick="login()">登录</button> </body> 二、js部分 <script type="text/javascript"> function keyLogin(){
敲回车登录
weixin_34197488的博客
11-22 127
$(document).keyup(function(event){ if(event.keyCode == 13){ onLogin(); } }) 转载于:https://www.cnblogs.com/88phper/p/7878018.html
JS按回车键实现登录的三种方法
weixin_34038293的博客
11-08 244
方法一： <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Check Score</title> <script language="JavaScript"> function keyLogin(){ if (event.keyCode==13) //回...
网页前端登录js按Enter回车键实现登陆的两种方法
10-22
下面小编就为大家带来一篇网页前端登录js按Enter回车键实现登陆的两种方法。小编觉得挺不错的，现在分享给大家，也给大家做个参考
js实现按回车自动登录功能
24号同学的博客
12-19 2117
目前是输完密码按回车实现登录，如果想在页面任何情况下按回车实现登录则  onkeydown位置就是这个函数的作用范围 function KeyDown() { if(event.keyCode==13){ var btn_login=document.getElementById("btn_login");//id为登录按钮id btn_login.focus()
jsp回车键登录代码
weixin_33910460的博客
11-27 118
$("body").keydown(function(event) { if (event.keyCode == "13") {// keyCode=13是回车键 $('#onsubmit').click(); } });  
按回车键登录功能代码
三味线的铲屎官的博客
12-05 869
script type="text/javascript">          //回车登陆     $(document).keydown(function(e){         if(!e){          e=window.event;         }         if(e.keyCode==13){           
js按回车键实现登陆
热门推荐
MaWenWu专栏
11-08 1万+
Check Score<!-- function keyLogin(){ if (event.keyCode==13) //回车键的键值为13 document.getElementById("input1").click(); //调用登录按钮的登录事件 }// --> -->
Ajax实现登录，点击登录按钮后不跳转页面而是直接打印返回的JSON内容
qq_42384506的博客
04-27 545
问题描述： Ajax实现登录，点击登录按钮后不跳转页面而是网页直接显示返回的JSON内容。 原因分析： 登录按钮button标签type用的是submit，这影响了Ajax交互的实现。 问题解决： 将登录按钮button标签type改成button。 <button class="layui-btn login_btn" id="login" type="button">...
JavaScript点击回车按钮后执行登陆操作
qq_36662478的博客
02-15 242
1. js代码 表单调用函数 //回车时，默认是登陆 function on_return(){ if(window.event.keyCode == 13){ if ($("#loginBtn")!=null &amp;&amp; $("#inputEmail3")!=null &amp;&amp; $("#inputPassword3")!=null){ ...
按Enter回车键实现登录
编程日常记录与总结 https://franciswmf.iteye.com
04-12 1159
第一种方法： Check Score function keyLogin(){ if (event.keyCode==13) //回车键的键值为13 document.getElementById("input1").click(); //调用登录按钮的登录事件 } 第二种方法： functio
JS enter键一键登录
weixin_33874713的博客
12-19 250
$("body").keydown(function (event) { if (event.keyCode == 13) { //enter键键值为13 $('.finish-btn').click(); // $('.finish-btn')是登录键，click()是登录键的点击事件调用 } ...
js按回车键进行登录
最新发布
10-15
在JavaScript中，我们可以通过监听键盘事件来实现按回车键进行登录的功能。 首先，我们需要获取到登录按钮的元素，可以使用`document.getElementById`或者`document.querySelector`来获取。假设登录按钮的id为...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值