vue 键盘事件keyup/keydoen

vue 键盘事件keyup/keydoen使用:当你按下键盘,键盘的值为13的时候,将会执行show函数方法以上两种keyup和keyup.13方法是一样的,点击回车按键,就会执行alert方法一些便捷方式:@keyup.13回


Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

使用:

<!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>

 

当你按下键盘,键盘的值为13的时候,将会执行show函数方法

以上两种keyup和keyup.13方法是一样的,点击回车按键,就会执行 alert 方法

 

一些便捷方式:

       @keyup.13 回车

  @keyup.enter 回车

  @keyup.left 左键

  @keyup.right 右键

  @keyup.up 上键

  @keyup.down 下键

  @keyup.delete 删除键

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/167930.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • matlab一阶惯性滤波,为什么一阶惯性环节也具有滤波的作用

    matlab一阶惯性滤波,为什么一阶惯性环节也具有滤波的作用在用simulink搭建模型的时候,发现一阶惯性环节具有滤波的作用,这是为什么呢?我们以一阶惯性环节200pi/(s+200pi)为例进行说明。首先从传递函数G(s)的频率特性说起。所谓系统的频率特性,是指系统在单位正弦相量作用下的稳态响应。因此,令传递函数中的s=jw,就可以得到系统的频率特性G(jw)。G(jw)是频率w的复变函数。他的幅值为|G(jw)|,相角为相角(G(jw))。当w从0到…

    2022年10月5日
  • 网页音乐播放器总结[通俗易懂]

    网页音乐播放器总结[通俗易懂]总结一下Vue实战的网页音乐播放器首先是设计出主体的整个框架分为四个部分最左边的歌曲列表,中间的唱片,最右边的热门评论显示以及下方的播放条然后开始准备进行功能的实现首先是需要导入Vue的依赖以及axios的js网络依赖库<!–开发环境版本,包含了有帮助的命令行警告–><scriptsrc=”https://cdn.jsdelivr.net/npm/vue/dist/vue.js”></script><!–官网提供的axio

    2022年6月17日
  • internal server error原因及解决

    internal server error原因及解决常见的内部服务错误的原因有二,一是服务器资源紧张,二是文件权限错误。1.错误的原因一:服务器资源超载。服务器的资源超载:即同一时间内处理器有太多的进程需要处理的时候,会出现500错误。借助SSH,可

    2022年7月4日
  • 每日一练No.1

    每日一练No.1

    2021年8月19日
  • 穷举暴力激活成功教程密码(真香版)

    穷举暴力激活成功教程密码(真香版)最近没事干,本来是准备激活成功教程邻居家WiFi密码的,后来发现太慢了,要加载好久,所以自己做了个测试机。下面是激活成功教程器源码:#include<windows.h>#include<iostream>#include<cstdio>#include<conio.h>usingnamespacestd;voiddown(chara){ keybd_event(a,(BYTE)0,0,0); keybd_event(a,(BYTE)0,

    2022年8月22日
  • Window下Tomcat端口被占用(Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at localhost are)

    Window下Tomcat端口被占用(Several ports (8005, 8080, 8009) required by Tomcat v7.0 Server at localhost are)问题:Eclipse中启动Tomcat时,遇到端口占有问题。解决方案:window下打开命令窗口(win+R)→输入cmd:输入 netstat -ano|findstr 8080(那个端口被占有,就输入那个端口),回车再次输入 taskkill /pid 12712/f(12712对应上图的12712 ),回车。 结束进程,重新启动Tomcat即可正常启动。  —…

    2022年6月13日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号