vue方法中传递dom对象示例
<div id="app">
<input type="text" v-on:keyup="onlyNum($event)">
</div> <script>
new Vue({
el:"#app",
methods: {
onlyNum: function (event){
event.target.value=event.target.value.replace(/[^\d]/g,'');
}
}
})
</script>
相当于:
<div id="app">
<input type="text" onkeyup="onlyNum(this)">
</div> <script>
function onlyNum(obj){
obj.value = obj.value.replace(/[^\d]/g,'');
}
</script>
js 原生代码的 “this” 相当于上面vue中 “event.target” 。js中事件绑定this,this指的是调用该函数的html元素;但vue的this指的是vue的对象本身,属于js对象方法中绑定this的情形;如果要访问调用该函数的html元素,只能用js的event对象中的target属性。
JavaScript this 关键字
注意:event是js的对象!
Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
event对象知识见这里
event.target见这里
vue方法中传递dom对象示例的更多相关文章
- nuxtjs在vue组件中使用window对象编译报错的解决方法
我们知道nuxtjs是做服务端渲染的,他有很多声明周期是运行在服务端的,以及正常的vue声明周期mounted之前均是在服务端运行的,那么服务端是没有比如window对象的location.navag ...
- js中的DOM对象和jQuery对象的比较
1. 二者的不同之处: 通过jQuery获取的元素是一个数组, 数组中包含着原生JS中的DOM对象. 例如, 针对下面的一个div结构: <div id="Box">& ...
- 在OCX初始化时获取其在网页中的DOM对象
OCX初始化的时候会调用SetClientSite,会传入IOleClientSite对象. CComQIPtr<IOleControlSite, &IID_IOleControlSit ...
- js中的DOM对象 和 jQuery对象 比较
一,二者的区别 通过 jQuery 获取的元素是一个数组,数组中包含着原生JS中的DOM对象. 总结:jQuery 就是把 DOM 对象重新包装了一下,让其具有了 jQuery 方法. 二,二者的相互 ...
- vue 数组中嵌套的对象添加新属性--页面更新
vue 数组中嵌套的对象添加新属性--页面更新:https://www.jianshu.com/p/8f0e5bb13735
- Python向方法中传递自定义类型参数
定义类型 class Fish: def __init__(self,x): self.num = xclass Turtle: def __init__(self,y): self.num = yc ...
- Jquery-获取iframe中的dom对象
父窗口中操作iframe: $(window.frames["iframeChild"].document) //假如iframe的id为iframeChild 在子窗口中操作父窗 ...
- jquery获取iframe中的dom对象
父窗口中操作iframe:$(window.frames["iframeChild"].document) //假如iframe的id为iframeChild 在子窗口中操作 ...
- JS中的DOM对象及JS对document对像的操作
DOM对象 windows:属性:opener(打开者) 方法:open().close(),setTimeout().setInterval()... location:属性:href 方法:rel ...
随机推荐
- Java 执行
java -cp****.jar ****.****.className [args] linux 下 -cp 参数使用 : 分割 一般都是 .:lib/* windows 下使用 ; 分割
- Gym - 101848D:XOR(线性基 欧拉降幂)
题意:给定N,K,P,表示现在有一个集合{0, 1, ..., 2n - 1},问有多少个非空子集的异或和为K: 答案%P.(1 ≤ n ≤ 1018, 0 ≤ k ≤ min(2n - 1, 101 ...
- 2018南京区域赛G题 Pyramid——找规律&&递推
先手动推出前10项,再上BM板子求出递推式 $A_n = 5A_{n-1} - 10A_{n-2} + 10A_{n-3} - 5A_{n-4} + A_{n-5}$,根据特征根理论可求出特征方程 $ ...
- scala 学习笔记--集合
1.scala集合的null 是nil 而不是null 2.set的三个方法union,intersect,diff union--合并去重 intersect--交集 diff--a减去(a和b交集 ...
- 关于绿盟RSAS使用时遇到的问题
本周在使用绿盟RSAS扫描工具时遇到了一些问题: 一.扫描工具在家测试可以正常工作,到了现场设置正确但Web端页面打不开: 二.扫描器可以正常进行扫描,并且成功扫描出结果,但显示目标主机没有问题: 原 ...
- 验证码破解 | Selenium模拟登陆微博
模拟登陆微博相对来说,并不难.验证码是常规的5个随机数字字母的组合,识别起来也比较容易.主要是用到许多Selenium中的知识,如定位标签.输入信息.点击等.如对Selenium的使用并不熟悉,请先移 ...
- vcenter监控
在vcenter上配置好用户名密码和url即可使用自动发现自动发现vmware
- 判断一个数是否能整开方,perfect square
int m,n;m=sqrt(n);m*m==n?yes:no; https://www.codewars.com/kata/56269eb78ad2e4ced1000013/solutions/ja ...
- 【数论】[素数筛,phi]P3601签到题
题目描述 给出l,r,要求求出\(\sum_{i = l}^r (i - phi[i]) mod 666623333\) \(1\leq l\leq r\leq 10^{12}\),\(r - l \ ...
- ring3 x32挂起进程注入原理.
目录 一丶挂起进程注入简介与前言 二丶ShellCode核心讲解. 2.1 保存Contex.EIP 2.2 DLL路径重定位 2.3 LoadLibrary的重定位 三丶 全部C++代码.拷贝即可使 ...