在做登录页面时候,通常当用户输入账号密码后直接按enter键就触发登录按钮了。
如果是input标签,vue中可以绑定按键修饰符,但是如果是其它标签呢。我的做法如下:

  1. document.querySelector('body').addEventListener('keyup', function (e) {
  2. if (e.keyCode == 13) { // enter 键值 为13
  3. document.querySelector('.button-keyup').click()
  4. };
  5. })

在其它标签上加入class button-keyup ,名字可以自己隋边取,只要获取到DOM节点即可。

如何在普通的元素上实现enter键的绑定的更多相关文章

  1. 为元素绑定监听键盘上的enter键被按下事件的方法

    $("someElement").on("keydown", function(event){ var key = event.which; if(key == ...

  2. HTML页面禁用Enter键自动提交表单

    今天在开发页面时,遇到一个小BUG,,如下图 在页面的文本框获取焦点之后,再按键盘上的Enter键,页面form就会自动提交.如下是页面禁止Enter自动提交代码: document.onkeydow ...

  3. 在ag-grid表格上实现类似Excel中的按下enter键自动跳转到下一行对应的输入框功能,Angular4开发

    最近的项目使用ag-grid在Angular中处理表格,收到个需求是要能够同时修改大量的数据,按下Enter键的时候,光标得自动跳到下一行的对应列上. 方法一:用ag-grid自带的 enterMov ...

  4. 按Enter键后Form表单自动提交的问题

    怪事年年有,今年特别多. 话说,最近项目中遇到一件怪事,当我鼠标focus在文本框中,轻轻敲了下回车键,尼玛页面突然刷新了,当时把宝宝给吓得. 接下来就是一番苦逼的烧脑和蛋疼~ 一.被表象所迷惑 突然 ...

  5. 回车和换行有什么区别?我们平时按下的Enter键是回车还是换行?

    来源:http://www.52rd.com/blog/Detail_RD.Blog_imjacob_12317.html -------------------------------------- ...

  6. 按下enter键后表单自动提交问题

    在HTML的form表单里,按下enter键之后,默认情况下表单会自动提交. 在公司一个项目里,按下enter键自动提交表单的查询结果与按下搜索框的搜索结果页面显示不一样,按下搜索按钮之后是通过Aja ...

  7. form表单按enter键自动提交的问题

    废话不多说.直接上代码. 1:form表单按enter键自动提交的情况 <!doctype html> <html lang="en"> <head& ...

  8. android软键盘enter键

    enter键,回车键,电脑键盘上enter键就有多种响应.android软键盘也不例外 你在EditText上输入以后,想在下一行输入框输入,可能需要去点击下一行输入框,让它获取焦点,也可能要隐藏软键 ...

  9. 【Chrome控制台】获取元素上绑定的事件信息以及监控事件

    需求场景 在前端开发中,偶尔需要验证下某个元素上到底绑定了哪些事件,以及监控某个元素上的事件触发情况. 解决方案 普通操作 之前面对这种情况,一般采取的措施就是在各个事件里写console.info, ...

随机推荐

  1. 56)PHP,模型类的设计思想

    一张表对应一个模型类-----Mode

  2. c# winForm 将窗体状态栏StatusStrip 分成左中右三部分 右边显示当前时间

    实现效果:通过StatusStrip显示窗体状态栏同时将状态栏分成三部分居左边显示相关文字信息中间空白显示居右边显示时间信息 1.创建窗体及添加StatusStrip  默认StatusStrip名称 ...

  3. PAT甲级——1036 Boys vs Girls

    1036 Boys vs Girls This time you are asked to tell the difference between the lowest grade of all th ...

  4. ESTScan|EORF|Augustus|nr|PSM|

    生物信息学方法的目的有二:1.常规找鉴定已知蛋白2.鉴定新蛋白 控制数据库大小可以通过增多酶切使得大数据库灵敏性增高数据量变小: 分步搜索是对于经典方法使用后找不到的新蛋白进行补充挖掘,预测蛋白与高可 ...

  5. S2SH项目实现分页功能

    javaWEB项目实现分页的方法很多,网上也有很多列子,最近工作中S2SH框架项目中需要一个分页的功能,查看了很多用一下方式实现,功能思路很清晰,觉得是很好的一种实现方法,记录下便多学习. 刚开始得到 ...

  6. Java实用教程系列之对象的转型

    体现: 父类的引用可以指向子类的对象接口的引用可以指向实现类的对象转型: 向上转型由子类类型转型为父类类型,或者由实现类类型转型为接口类型向上转型一定会成功,是一个隐式转换向上转型后的对象,将只能访问 ...

  7. Pytorch collate_fn用法

    By default, Dataloader use collate_fn method to pack a series of images and target as tensors (first ...

  8. 20181026_队测_Brick Game

    题目描述 给出一个\(n\)行\(m\)列的矩阵,矩阵中每个格子有一个非负整数,现在要求你去除其中的个格子,使得剩下的格子中的数的总和最大.另外,去除\(k\)个格子后,剩下的格子必须满足以下几个性质 ...

  9. 吴裕雄--天生自然 R语言开发学习:重抽样与自助法(续一)

    #-------------------------------------------------------------------------# # R in Action (2nd ed): ...

  10. mybatis 添加后获得该新增数据自动生成的 id

    // useGeneratedKeys默认值为false,keyProperty的值对应的是User类中的主键字段名 // mybatis 写法如下 <insert id="inser ...