Vue2键盘事件：keydown/keyup...
Vue2键盘事件：keydown/keyup...
1.使用
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script src="vue.js"></script> <script type="text/javascript">
window.onload = function(){
var vm = new Vue({
el:'#box',
methods:{
show:function(ev){
if(ev.keyCode == 13){
alert('你按回车键了');
}
},
}
});
}
</script>
</head>
<body>
<div id="box">
<input type="text" placeholder="请输入" @keyup="show($event)"> <input type="text" placeholder="请输入" @keyup.13="show($event)">
</div>
</body>
</html>
当按下键盘的时候，执行show方法，然后再去执行相应的业务。
两个input的效果都是一样的 如果安13 也就是按键 enter 才会执行弹窗！！
@keyup.13 回车
@keyup.enter 回车
@keyup.left 左键
@keyup.right 右键
@keyup.up 上键
@keyup.down 下键
@keyup.delete 删除键
Vue2键盘事件：keydown/keyup...的更多相关文章
- 键盘事件keydown、keypress、keyup随笔整理总结（摘抄）
原文1:http://www.cnblogs.com/silence516/archive/2013/01/25/2876611.html 原文2:http://www.cnblogs.com/leo ...
- 详解键盘事件(keydown，keypress，keyup)
一.键盘事件基础 1.定义 keydown:按下键盘键 keypress:紧接着keydown事件触发(只有按下字符键时触发) keyup:释放键盘键 顺序为:keydown -> keypre ...
- Vue2键盘事件
这两天学习了Vue.js 感觉组件这个地方知识点挺多的,而且很重要,所以,今天添加一点小笔记,学习一下Vue键盘事件 键盘事件 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 1 ...
- 键盘事件keydown、keypress、keyup随笔整理总结
英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chr ...
- 键盘事件keydown、keypress、keyup
事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chrome:输入触发k ...
- 无线端不响应键盘事件(keydown,keypress,keyup)
今天在项目时,在android手机上使用输入法的智能推荐的词的话,不会触发keyup事件,一开始想到在focus时使用一个定时器,每隔100ms检测输入框的值是否发生了改变,如果改变了就作对应的处理, ...
- 键盘事件（keyup、keydown、keypress）
1.onkeyup 和onkeydown时,keyCode是不区分大小写的,会将小写字母自动转化为大写字母. 2 onkeypress时,区分大小写. 3兼容event.keyCode||event. ...
- Vue2学习笔记:键盘事件
Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...
- Vue 键盘事件
Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...
随机推荐
- [转载]CentOS6 快速搭建轻量级远程桌面 Xfce&nb
原文地址:CentOS6 快速搭建轻量级远程桌面 Xfce & VNC & Firefox作者:哈囉健一 0.系统信息 CentOS Linux release 6.0 (Final) ...
- Java实现List数组的几种替代方案
在Java中,禁止定义List<Integer>a[],这种List数组结构. 但是还是可以使用其它一些方式来实现列表数组. 一.使用Node把List包裹起来 public class ...
- 树莓派 SD卡镜像备份
一.准备工作 1.已经配置启动的树莓派SD卡 2.Linux系统的pc 3.读卡器 二.修改SD卡文件 刚开始我先再win7下把SD卡接到pc上,发现无法读取.用DISKGENIUS查看pc的磁盘状态 ...
- POJ 2676 Sudoku （DFS）
Sudoku Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 11694 Accepted: 5812 Special ...
- HDU 2067 小兔的棋盘 （卡特兰数）
小兔的棋盘 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submi ...
- mysql insert if not exists防止插入重复记录的方法(转)
MySQL 当记录不存在时插入(insert if not exists) 在 MySQL 中,插入(insert)一条记录很简单,但是一些特殊应用,在插入记录前,需要检查这条记录是否已经存在,只有当 ...
- C# Random 生成不重复随机数
命名空间:System 表示伪随机数生成器,一种能够产生满足某些随机性统计要求的数字序列的设备. 伪随机数是以相同的概率从一组有限的数字中选取的.所选数字并不具有完全的随机性,因为它们是用一种确定的数 ...
- Http网络协议
目录结构: contents structure [-] 什么是HTTP协议 Http协议的发展历史 Http的报文结构 客户端请求 服务端响应消息 Content-Type application/ ...
- Linux安装最新版Mono,Jexus（截至2015年12月30日）
安装系统必备: yum -y install gcc gcc-c++ bison pkgconfig glib2-devel gettext make libpng-devel libjpeg-dev ...
- golang学习 ----获取URL
package main import ( "fmt" "io/ioutil" "net/http" "os" ) fu ...