zoukankan      html  css  js  c++  java
  • vue16 自定义键盘属性

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>智能社——http://www.zhinengshe.com</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <style>
        </style>
        <script src="vue.js"></script>
        <script>
            window.onload=function(){
                var vm=new Vue({
                    el:'#box',
                    data:{
                        a:'blue'
                    },
                    methods:{
                        show:function(){
                            alert(1);
                        }
                    }
                });
            };
        </script>
    </head>
    <body>
        <div id="box">
            <input type="text" @keydown.c="show">
            <input type="text" @keydown.enter="show">
        </div>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>智能社——http://www.zhinengshe.com</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <style>
        </style>
        <script src="vue.js"></script>
        <script>
            //ctrl->17
            /*document.onkeydown=function(ev){
                console.log(ev.keyCode);
            };*/
            window.onload=function(){
                var vm=new Vue({
                    el:'#box',
                    data:{
                        a:'blue'
                    },
                    methods:{
                        show:function(){
                            alert(1);
                        }
                    }
                });
            };
        </script>
    </head>
    <body>
        <div id="box">
            <input type="text" @keydown.17="show">
        </div>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>智能社——http://www.zhinengshe.com</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <style>
    
        </style>
        <script src="vue.js"></script>
        <script>
            //ctrl->17
            /*document.onkeydown=function(ev){
                console.log(ev.keyCode);
            };*/
            Vue.directive('on').keyCodes.ctrl=17;  //17起了别名叫ctrl
            Vue.directive('on').keyCodes.myenter=13;
    
            window.onload=function(){
                var vm=new Vue({
                    el:'#box',
                    data:{
                        a:'blue'
                    },
                    methods:{
                        show:function(){
                            alert(1);
                        }
                    }
                });
            };
    
        </script>
    </head>
    <body>
        <div id="box">
            <input type="text" @keydown.ctrl="show">
            <input type="text" @keydown.myenter="show">
            <input type="text" @keydown.myenter="show | debounce 2000">
        </div>
    
    </body>
    </html>
  • 相关阅读:
    Effective Java(二)—— 循环与 StringBuilder
    Java 错误:找不到或无法加载主类(源文件中含有包名 package)
    古代文学经典、现代文学经典
    逻辑一致、交叉验证
    框架设计的一些思考
    Ping
    Hypver-V中的快照
    事件日志订阅-基于 源已启动
    组策略--下发计划任务到计算机
    组策略--下发文件到计算机
  • 原文地址:https://www.cnblogs.com/yaowen/p/6977685.html
Copyright © 2011-2022 走看看