zoukankan      html  css  js  c++  java
  • Vue 键盘事件

    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 删除键

  • 相关阅读:
    Nginx安装详细指南
    git 常用命令
    oracle server config
    CentOS6.5下安装oracle11gR2
    oracle query
    oracle function
    oracle note
    正则表达
    DOM&BOM的起源、方法、内容、应用
    sticky
  • 原文地址:https://www.cnblogs.com/thinkingthigh/p/7598978.html
Copyright © 2011-2022 走看看