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>
vue16 自定义键盘属性的更多相关文章
- UI：自定义键盘的实现
自定义我的封装键盘,并在试图控制器里对接 (解决多 输入框问题,把输入框存入到可变数组) @implementation AppDelegate - (BOOL)application:(UIAppl ...
- Vue2.0的变化 ，组件模板，生命周期，循环，自定义键盘指令，过滤器
组件模板: 之前: <template> <h3>我是组件</h3><strong>我是加粗标签</strong> </templat ...
- vue.js之过滤器，自定义指令，自定义键盘信息以及监听数据变化
一.监听数据变化 1.监听数据变化有两种,深度和浅度,形式如下: vm.$watch(name,fnCb); //浅度 vm.$watch(name,fnCb,{deep:true}); //深度监视 ...
- swift3.0 自定义键盘
...绕了一大圈,又绕回原生来了,今天,学习一下swift3.0语法下的自定义键盘.效果图如下: 其实,很简单,只需要把UITextView(或者UITextField)的inputView属性设置为 ...
- vue教程2-08 自定义键盘信息、监听数据变化vm.$watch
vue教程2-08 自定义键盘信息 @keydown.up @keydown.enter @keydown.a/b/c.... 自定义键盘信息: Vue.directive('on').keyCode ...
- 【iOS自定义键盘及键盘切换】详解
[iOS自定义键盘]详解 实现效果展示: 一.实现的协议方法代码 #import <UIKit/UIKit.h> //创建自定义键盘协议 @protocol XFG_KeyBoardDel ...
- Android之探究viewGroup自定义子属性参数的获取流程
通常会疑惑,当使用不同的布局方式时,子view得布局属性就不太一样,比如当父布局是LinearLayout时,子view就能有效的使用它的一些布局属性如layout_weight.weightSum. ...
- ios 自定义键盘
由于项目需要,需要自定义键盘.ios系统键盘会缓存键盘输入,并保存在系统目录下的文件里,并且是明文存储,存在帐号密码泄漏风险.在别人代码基础上修改了下,美化了下界面,去掉了字符输入,加了点击特效,截图 ...
- Android读取自定义View属性
Android读取自定义View属性 attrs.xml : <?xml version="1.0" encoding="utf-8"?> < ...
随机推荐
- 原生ajax实现文件上传
视图层 JS 函数: <input type="file" onchange="sendFile()" id="up" /> ...
- js得到区域长宽
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- 特斯拉正加快部署第三代Autopilot自动驾驶计算机
新浪科技讯,北京时间 4 月 10 日下午消息,据电动汽车新闻网站 Electrek 报道,特斯拉正在加快部署第三代 Autopilot 自动驾驶计算机,因为当前一代产品的计算能力即将被耗尽. 201 ...
- centos部署nginx服务
1.准备安装程序 pcrl-8.43.tar.gz zlib-1.2.11.tar.gz openssl-1.0.1j.tar.gznginx-1.9.9.tar.gz 2.将下载的包拷贝到/us ...
- Qt之图形（绘制漂亮的圆弧）
简述 综合前面对二维绘图的介绍,想必我们对一些基本绘图有了深入的了解,下面我们来实现一些漂亮的图形绘制. 简述 圆形 效果 源码 弧形 效果 源码 文本 效果 源码 旋转 效果 源码 圆形 经常地,我 ...
- python批量下载色影无忌和蜂鸟的图片 爬虫小应用
有些冗余信息.由于之前測试正則表達式.所以没有把它们给移走.只是不影响使用. # -*- coding:utf-8 -*- import re,urllib,sys,os,time def getAl ...
- JAVA学习第四十六课 — 其它对象API（二）Date类 & Calendar类（重点掌握）
Date类(重点) 开发时,会时常遇见时间显示的情况,所以必须熟练Date的应用 <span style="font-family:KaiTi_GB2312;font-size:18p ...
- 【试水CAS-4.0.3】第02节_CAS服务端登录页个性化
完整版见https://jadyer.github.io/2015/07/16/sso-cas-login-diy/ /** * @see ------------------------------ ...
- hdu_1754，线段树单点更新，求区间最值
http://www.notonlysuccess.com/index.php/segment-tree-complete/ #include<iostream> #include< ...
- spring boot 的常用注解使用 总结
附:Spring Boot 官方文档学习(一)入门及使用见https://www.cnblogs.com/larryzeal/p/5799195.html @RestController和@Reque ...