原理:按下enter的事件属于键盘事件,我们可以先用下面函数来获取enter的键码(键盘上的按键都有各自的键码),通过这个键码可以来判断按下的是哪个键

document.addEventListener("keyup",function(e){
console.log(e.keyCode)
})

通过上面函数我们知道enter的键码是  13,那么最后只需要判断一下,键盘按下时键码是13时就执行我们需要的内容,就可以实现我们要的效果了。

这个效果通常用于按下enter执行搜索等操作。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input placeholder="输入一些文本" type="text">
<script>
var inputText=document.querySelector("input");
inputText.addEventListener("keyup",function(e){
if(e.keyCode==13){
alert(1)//要执行的内容
}
})
</script>
</body>
</html>

按下enter触发事件的更多相关文章

  1. angular 按下回车键触发事件

    angularJs  按下回车键触发事件这个功能很简单,但是今天的却让我掉坑很久.... 由于我的页面上有两个不同方法都传$event事件,如search($event)和create($event) ...

  2. js中点回车enter触发事件&layui弹窗按enter键不停弹窗问题的解决&js实现鼠标焦点自动落到文本框(layui)

     js中回车触发事件 一. document.onkeydown = function (e) { // 回车提交表单 // 兼容FF和IE和Opera var theEvent = window.e ...

  3. js中按下回车触发事件

    方法一:document.onkeydown = function (e) { // 回车提交表单// 兼容FF和IE和Opera var theEvent = window.event || e; ...

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

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

  5. JQuery触发hover事件无效时使用js原生的触发事件方法

    需求:在开发一个从微信公众号后台管理网页上爬取数据的chrome插件时,有部分页面元素是只显示了部分摘要信息的,需要把鼠标移上去后才能显示全部信息(类似title的弹出显示).这就需要在chrome插 ...

  6. 屏蔽Enter触发的事件

    无论是 <button type="button" onclick="console.log('123');">123</button> ...

  7. jQuery实现按Enter键触发事件?

    按Enter触发 $(function(){ document.onkeydown = function(e){ var ev = document.all ? window.event : e; ) ...

  8. enter键触发事件的清除

    使用iframe弹窗时 父级页面 初始化的时候 给enter键绑定了事件 在子页面中 按下enter键会触发 而报错,此时在本页面的初始化的时候 将enter键绑定的方法取消 即可: $(docume ...

  9. 刷新各ifream当前页,下拉项改变触发事件js,给选中项加背景色js

    <script type="text/javascript" language="javascript"> //刷新框架各页面 function r ...

随机推荐

  1. AppCan全局搜索

    Ctrl + H,在项目中全局搜索英文和中文

  2. vim /etc/security/limits.conf中的hard和soft

    转自:https://blog.csdn.net/zxljsbk/article/details/89153690 "soft" 和 "hard" 的区别sof ...

  3. idea-代码格式化快捷键设置(2019.1版)

    idea默认格式化快捷键是:Ctrl+Alt+L,有时会因其它软件快捷键的冲突导致失灵. 设置方法如下: 1.File -->  Settings... 2. Keymap -> Code ...

  4. 简析P和NP问题的概念

    简析P和NP问题的概念 本文系作者学习笔记,内容均来源于网络,如有侵权,请联系删除 P类问题:所有能用多项式时间算法计算得到结果的问题,称为多项式问题,也就是P(polynomial). 多项式时间举 ...

  5. jQuery中$()的四种种使用方式

    1.$()中接收一个回调函数,作为dom.ready事件(在dom树加载完成后执行的函数)如: $(function(){ /** 执行代码*/ }) 2.$()中接收字符串选择器,返回该选择器对应的 ...

  6. JS异步上传文件

    直接调用Upload(option)方法,即可上传文件,不需要额外的插件辅助,采用原生js编写. /* *异步上传文件 *option参数 **url:上传路径 **data:上传的其他数据{id:& ...

  7. 第一篇、Python入门

    一 编程与编程语言 python是一门编程语言,作为学习python的开始,需要事先搞明白:编程的目的是什么?什么是编程语言?什么是编程? 编程的目的: #计算机的发明,是为了用机器取代/解放人力,而 ...

  8. Tensorflow模型移植Arm之一:C与Python互相调用

    一.C调用Python 1.新建一个Python文件,名称为py_multipy.py: #import numpy as np def multiply(a=1,b=2): print('Funct ...

  9. nginx服务学习第一章

    一.ubuntu系统安装nginx服务 # apt-get install nginx 二.nginx.config配置文件详解 配置文件结构: 全局块(全局变量) events{ } http{ h ...

  10. golang 结构体嵌入和匿名成员

    考虑一个二维的绘图程序,提供了一个各种图形的库,例如矩形.椭圆形.星形和轮形等几 何形状.这里是其中两个的定义 type Circle struct { X, Y, Radius int } type ...