vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native
vue运行为v-on在监听键盘事件时,添加了特殊的键盘修饰符:\
<input v-on:keyup.13="submit">
vue还非常贴心地给出了常用按键的别名,这样就不必去记keyCode ~ ~
上面代码,还可以在这样写:
<input v-on:keyup.enter="submit"> <input @keyup.enter="submit">
全部的键盘别名:
.enter .tab .delete (捕获 “删除” 和 “退格” 键) .esc .space .up .down .left .right
还有一些组合按键:
.ctrl .alt .shift .meta(window系统下是window键,mac下是command键)
Alt + C :
<input @keyup.alt.67="doSth">
Ctrl + Click :
<div @click.ctrl="doSth">点我</div>
注意!!!如果用了封装组件的话,比如element,这个时候使用按键修饰符需要加上.native
比如:
<el-input v-model="account" placeholder="请输入账号" @keyup.enter.native="search()"></el-input>
vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native的更多相关文章
- Vue监听键盘回车事件
在写页面时遇见了登录页需要加一个键盘回车事件. vue 的 v-on中有这样的修饰符 <input v-on:keyup.enter="submit"> 即<in ...
- js及vue监听键盘回车事件
js document.onkeydown = (event) => { var e = event || window.event; if(e && e.keyCode==13 ...
- 如何在ArcMap中监听键盘鼠标事件(转)
如何在ArcMap中监听键盘鼠标事件(转) Link: http://www.cnblogs.com/dyllove98/p/3155551.html 昨天有个朋友想要实现一个功能,就是在ArcMap ...
- 如何在ArcMap中监听键盘鼠标事件
昨天有个朋友想要实现一个功能,就是在ArcMap中编辑数据的时候,能够通过快捷键自动设置预定义的属性,比如,选中若干要素,按A键,就自动填充属性,按B键,则又自动填充另外的属性字段. 单就这个功能而言 ...
- vue在某页面监听键盘输入事件
需求:在某一网页,通过上下左右键控制一些操作 实现: 1.基本代码: 因为没有绑定特定的元素.所以我们将事件绑定到document上. //当前页面监视键盘输入 document.onkeydown ...
- 【土旦】vue 解决ios H5底部输入框 获取焦点时弹出虚拟键盘挡住输入框 以及监听键盘收起事件
问题描述 im聊天H5页面,在iOS系统下,inpu获取焦点弹出系统虚拟键盘时,会出现挡住input的情况,十分影响用户体验. bug图 解决方法: html: <input type=&quo ...
- Winform下WebBrowser 编辑模式 监听键盘按键事件
最近使用 WebBrowser 做了个富文本编辑器(其实网上有很多很多).例如下面这个玩意(不要在意界面神马的) WebBrowser在编辑模式下可以有一些HTML标签的功能,改变字体大小颜色等等等. ...
- js监听键盘回车
//监听回车 $(document).keydown(function(e) { ) { $("#btnLogin").click(); } }) //input绑定回车 $('# ...
- js监听键盘方向键事件
<SCRIPT language=javascript> document.onkeydown = chang_page; function chang_page() { || ) loc ...
随机推荐
- Go语言操作Redis
Go语言操作Redis Redis介绍 Redis是一个开源的内存数据库,Redis提供了多种不同类型的数据结构,很多业务场景下的问题都可以很自然地映射到这些数据结构上.除此之外,通过复制.持久化和客 ...
- java 内部类、匿名内部类
一:内部类 1:什么是内部类? 大部分时候,类被定义成一个独立的程序单元.在某些情况下,也会把一个类放在另一个类的内部定义,这个定义在其他类内部的类就被称为内部类(有些地方也叫做嵌套类),包含内部类的 ...
- TCP协议探究(二):超时与重试
1 概述 TCP提供可靠的运输层. 可靠性保证之一:确认从另一端收到的数据. 但数据和确认都有可能会丢失.TCP通过在发送时设置一个定时器来解决这种问题. 如果当定时器溢出时还没有收到确认,它就重传该 ...
- C语言如何才能使用bool类型
解决办法:加上头文件#include<stdbool.h> ,就可以直接使用类型bool = true/false; #include<stdio.h> 2 #include& ...
- 泛型约束:接口约束、new()构造函数约束、组合约束(即多种约束合并)
泛型 接口约束: using System; namespace ConsoleApp1 { /* * * 接口约束:where T:interfaceName * T是类型形参的名称,interfa ...
- 判断ubuntu是32位还是64位
在终端输入 sudo uname -m 显示 如果显示i686,你安装了32位操作系统 如果显示 x86_64,你安装了64位操作系统 更多: sudo uname -s 显示内核名字s sudo u ...
- Python中import导入上一级目录模块及循环import问题的解决
转自:https://www.cnblogs.com/sjy18039225956/p/9265461.html 使用python进行程序编写时,经常会使用第三方模块包.这种包我们可以通过python ...
- Oracle 如何查看当前的实例及切换实例
一.Oracle查看当前实例 1.打开终端,输入命令sqlpuls / as sysdba连接到数据库 2.输入命令show parameter name便可以查看当前登录数据库的参数配置,如下可以看 ...
- 5.Servlet 对象(request-response)
/*ServletResponse*/ /*responese常见应用*/ 1.向客户端输出中文数据 (分别以OutputStream 和 PrintWriter输出) 2.文件下载和中文文件的下载 ...
- go语言入门(7)面向对象编程
1,概述 对于面向对象编程的支持Go 语言设计得非常简洁而优雅.因为, Go语言并没有沿袭传统面向对象编程中的诸多概念,比如继承(不支持继承,尽管匿名字段的内存布局和行为类似继承,但它并不是继 ...