这篇文章主要介绍了原生JS按回车键实现登录的方法，众所周知，这是在web程序设计中的一个非常实用的小技巧，主要用于表单提交，包括注册、登录等等功能，具有很好的用户体验，有着非常广泛的实用价值，需要的朋友可以参考一下：
<html>

<head>

<title>原生JS按回车键实现登录</title>

<meta charset="utf-8">

</head>

<body>

<input placeholder="请输入用户名" type="text" onkeydown="keyEnter()">

<input placeholder="请输入密码" type="password" onkeydown="keyEnter()">

<input value="登录" type="button" name="submit" onClick="login()">

<script type="text/javascript">

function keyEnter(){//按下enter键，执行登录按钮的登录事件 回车键的键值为13

if(event.keyCode==13){

document.getElementsByName("submit")[0].click();

}

}

function login(){

alert('调用成功666！');

}

</script>

</body>

</html>

具体的登录功能，放到login()中即可。

原生js按回车键实现登录的更多相关文章

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

    本文实例讲述了JS按回车键实现登录的方法,该功能有着非常广泛的实用价值.分享给大家供大家参考之用.具体方法如下: 方法一: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 < ...

  2. js 捕捉回车键触发登录，并验证输入内容

    js 捕捉回车键触发登录,并验证输入内容 有时候我们会遇到 web 页面中捕捉按键,触发一些效果, 比如常见的回车键触发登录,并验证输入内容,下面会介绍,截图: 一.最简单的捕捉回车键:判断按下的是不 ...

  3. vue.js中 ,回车键实现登录或者提交表单!

    vue的功能非常强大,但是我们作为一个后端开发人员,前端的东西不一定都弄的很明白,今天就给大家介绍一个回车提交表单的真实案例,达到回车登录的效果! @ keyup.enter 实现的效果 <in ...

  4. 原生js+css实现重力模拟弹跳系统的登录页面

    今天小颖把之前保存的js特效视频看了一遍,跟着视频敲了敲嘻嘻,用原生js实现一个炫酷的登录页面.怎么个炫酷法呢,看看下面的图片大家就知道啦. 效果图: 不过在看代码之前呢,大家先和小颖看看css中的o ...

  5. 原生js登录创建cookie

    原生js创建cookie,功能:点击登录按钮时,将用户名.密码存为cookie:页面再次加载时,自动读取cookie中的用户名.密码. <html><head><titl ...

  6. 原生JS实现拖动滑块验证登录效果

    ♀分享一组利用原生JS实现拖动滑块验证效果 ♀在这个组代码中涉及三个方面的知识: ⑴事件处理 ⑵添加验证标记 ⑶选择器的封装   代码如下: <!DOCTYPE html> <htm ...

  7. 原生js发送ajax请求

    堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...

  8. 用原生JS写移动动画案例及实际应用

    js很强大 相信很多人都知道,那么它有哪些强大之处呢?有兴趣的人可以去查查,这里就不赘述了,因为不在本片文章讨论的范围. 我们要讲的是怎么用原生JS写移动动画?我们先举一个最简单的动画例子,很多网站的 ...

  9. 利用原生js制做数据管理平台，适合初学者学习

    摘要:数据管理平台在当今社会中运用十分广泛,我们在应用过程中,要对数据进行存储,管理,以及删除查询等操作,而我们在实际设计的时候,大牛们大多用到的是JQuery,而小白对jq理解也较困难,为了让大家回 ...

随机推荐

  1. .htaccess详解

    http://www.cnblogs.com/adforce/archive/2012/11/23/2784664.html .htaccess是什么 .htaccess文件(或者"分布式配 ...

  2. Python之路Day06

    小数据池 == 判断两个值是否相等 is -- 是,判断两边的内存地址是否相同 a=10 b=10 print(a is b) id() -- 查看内存地址 代码块 一个py文件,一个函数,一个模块, ...

  3. cURL是什么

    原文链接:https://www.leiue.com/what-is-curl cURL 是一个利用 URL 语法在命令行下工作的文件传输工具,1997 年首次发行.它支持文件上传和下载,所以是综合传 ...

  4. apk 测试入门基本操作

    通过以上两个方法查询到运行的system service后,就可以在dumpsys后面加上service的名字,查看指定的service信息. // 查看Activity相关信息adb shell d ...

  5. CentOS7.5下基于FTP服务的局域网yum源搭建

    实验环境 yum源服务器和yum客户端都处于同一局域网之中 yum源服务器 hostname:zabbix OS版本:CentOS 7.5 IP:192.168.101.201 yum客户端 host ...

  6. django初步了解（一）

    安装django pip3 install django==版本号 创建一个djangp项目 django-admin startproject 项目名 目录介绍: 运行django项目: pytho ...

  7. Solr与JDK对应版本关系，Tomcat与JDK版本对应关系

    最新在部署solrCloud集群,由于自己机器上用的JDK都是JDK1.7的,然后我就从网上下载了最新下载了最先的solr6.6.0和最新的Tomcat9.0,部署了一下,开始报错,提示solr和JD ...

  8. Flink系统配置

    Flink 系统配置 Flink 提供了多个配置参数,用于调整Flink的行为与性能,所有参数均在flink-config.yaml 文件中.下面我们介绍一下几个主要配置. Java and Clas ...

  9. Docker - 构建一个简单的应用镜像

    概述 做个简单的可用镜像 背景 之前的镜像, 都是 命令教程 类的 这次我想构建一个 可以用的 简单镜像镜像 1. 环境 os centos7 docker 18.09 docker image ja ...

  10. HTML5学习（3）元素

    HTML5元素周期表 详情见:http://www.xuanfengge.com/funny/html5/element/