zoukankan      html  css  js  c++  java
  • 29.VUE学习之--键盘事件.键盘修饰符的实例讲解

    键盘事件

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>
    <body>
    <div id="hdcms">
        <!--13=enter回车 /tab/delete/esc/space(空格)/up/down/left/right-->
        <!--alt/ctrl/shift 这三个键要配合其它任意键才会触发 例: @keyup.ctrl.65 (ctrl+a键触发 65是a的asci码)-->
        <input type="text" v-model='content' @keyup.ctrl.65="keyEvent">
        <li>{{content}}</li>
    </div>
    <script>
        var app = new Vue({
            el: '#hdcms',
            data: {
                content:'',
            },
            methods: {
                keyEvent(){
                    console.log(this.content);
                }
            }
        });
    </script>
    </body>
    </html>
    

    效果:

    ASCII 表

    如果是字母要用十进制的大字字母的ascii,才能对应到键盘上对应的字母键
    https://baike.baidu.com/item/ASCII/309296?fr=aladdin

    [Haima的博客] http://www.cnblogs.com/haima/
  • 相关阅读:
    FCC学习笔记(二)
    FCC学习笔记(一)
    jQuery(三)
    jQuery(二)
    jQuery(一)
    JavaScript(九)
    JavaScript(八)
    2-1回归算法
    14-章小结
    13-模型训练及测试
  • 原文地址:https://www.cnblogs.com/haima/p/10238194.html
Copyright © 2011-2022 走看看