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...的更多相关文章

  1. 键盘事件keydown、keypress、keyup随笔整理总结（摘抄）

    原文1:http://www.cnblogs.com/silence516/archive/2013/01/25/2876611.html 原文2:http://www.cnblogs.com/leo ...

  2. 详解键盘事件(keydown，keypress，keyup)

    一.键盘事件基础 1.定义 keydown:按下键盘键 keypress:紧接着keydown事件触发(只有按下字符键时触发) keyup:释放键盘键 顺序为:keydown -> keypre ...

  3. Vue2键盘事件

    这两天学习了Vue.js 感觉组件这个地方知识点挺多的,而且很重要,所以,今天添加一点小笔记,学习一下Vue键盘事件 键盘事件 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 1 ...

  4. 键盘事件keydown、keypress、keyup随笔整理总结

    英文输入法:   事件触发顺序:keydown - > keypress - > keyup   中文输入法:   firfox:输入触发keydown,回车确认输入触发keyup chr ...

  5. 键盘事件keydown、keypress、keyup

    事件触发顺序:keydown - > keypress - > keyup   中文输入法:   firfox:输入触发keydown,回车确认输入触发keyup chrome:输入触发k ...

  6. 无线端不响应键盘事件(keydown,keypress,keyup)

    今天在项目时,在android手机上使用输入法的智能推荐的词的话,不会触发keyup事件,一开始想到在focus时使用一个定时器,每隔100ms检测输入框的值是否发生了改变,如果改变了就作对应的处理, ...

  7. 键盘事件（keyup、keydown、keypress）

    1.onkeyup 和onkeydown时,keyCode是不区分大小写的,会将小写字母自动转化为大写字母. 2 onkeypress时,区分大小写. 3兼容event.keyCode||event. ...

  8. Vue2学习笔记:键盘事件

    Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...

  9. Vue 键盘事件

    Vue2键盘事件:keydown/keyup... 1.使用 <!DOCTYPE html> <html> <head> <title></tit ...

随机推荐

  1. PHP-SESSION深入理解

    1.浏览器窗口与SESSION间的关系 记得去年的时候网上抢手机(你懂的), 特意开两个窗口, 哪个进度快用哪个.如此到输入验证码的时候老是出错, 结果----没抢到~ 后来写了个程序, 如下: &l ...

  2. [转载]在VirtualBox中收缩虚拟磁盘映像文件

    原文地址:在VirtualBox中收缩虚拟磁盘映像文件作者:bobby 由于经常要测试一些软件,我在VirtualBox虚拟机中安装了一套Windows.使用过虚拟机的朋友都知道,为了节省硬盘空间,一 ...

  3. Windows XPSP3通过网络级身份验证方式连接Windows Server 2008远程桌面

    远程桌面大大方便了大家的日常管理工作,Windows Server 2008同样秉承这一优秀特性,并引入网络级身份验证(NLA)作为远程桌面连接的默认身份验证方式. 网络级身份验证 (NLA) 是一种 ...

  4. boost boost::asio::read socket.read_some 区别

    boost boost::asio::read 尝试读一定数量的字节,直到读到为止,或者出错 socket.read_some 读一下socket,读到多少算多少 带async的类似

  5. [think]关于个人发展值得记住的一些建议 听别人的话，即使你不想听 不要只做不想 成功不能被复制，但失败总在不停复制。看看别人是怎么倒下的，你可以更早地成功

    [think]关于个人发展值得记住的一些建议 偶然看到一篇采访周爱民的文章,里面的一些建议虽然朴实无华,却感觉很有道理,特此记录: 记者:对于程序员的技术发展和职业规划能否给大家一些建议呢?----- ...

  6. mysql5.7忘记密码时，修改root密码

    (1).由于MySQL5.7在安装完后,第一次启动时,会在root目录下生产一个随机的密码,文件名为 .mysql_secret 所以,登录时需要用随机密码登录,然后通过以下命令修改密码 “SET P ...

  7. 【struts2】Struts2的运行流程

    1)前提条件 在讲解流程之前,假设我们已经建立了的一个名为strutsDeepen的web工程,该工程仅仅实现了简单的用户登陆与欢迎界面.具体的实现为: 在web.xml中配置了Struts2的过滤器 ...

  8. c2java select algorithm

    对于非常多应用来说,随机算法是最简单的或者最快的.既简单又快的有没有呢? 那须要深刻的洞察力或者革命性的突破. 什么是随机算法 随机算法与确定算法差别是:它还接收输入随机比特流来做随机决策. 对于同一 ...

  9. 【转】Java利用反射机制访问私有化构造器

    Java利用反射机制访问私有化构造器 博客分类: java   我们都知道,当一个类的构造方法被设为私有的时候(private),在其他类中是无法用new来实例化一个对象的. 但是有一种方法可以把带有 ...

  10. MySql 按周/月/日统计数据的方法

    知识关键词:DATE_FORMAT  select DATE_FORMAT(create_time,'%Y%u') weeks,count(caseid) count from tc_case gro ...