饿了么 <el-input></el-input>输入框获取与失去焦点事件
//1.定义focus事,绑定属性
<el-input
v-model="headerInput"
@focus="onInputFocus"
@blur="onInputBlur":style="thisStyle">
</el-input>
thisStyle:'', //2.获得焦点事件
onInputFocus(){
let self = this;
self.thisStyle="outline: 0;box-shadow: 0px 0px 10px 0px #ffffff;transition: border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;-moz-transition:border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;-webkit-transition:border ease-in-out 0.15s,box-shadow ease-in-out 0.15s;"
}, //3.失去焦点事件
onInputBlur(){
let self = this;
self.thisStyle = "width: 330px;"
},
饿了么 <el-input></el-input>输入框获取与失去焦点事件的更多相关文章
- 让input表单输入框不记录输入过信息的方法
有过表单设计经验的朋友肯定知道,当我们在浏览器中输入表单信息的时候,往往input文本输入框会记录下之前提交表单的信息,以后每次只要双击input文本输入框就会出现之前输入的文本,这样有时会觉得比较方 ...
- input输入框获得、失去焦点添加事件
onBlur:当输入框失去焦点后 onFocus:当输入框获得焦点后 这两个JavaScript事件是写在html标签中的例如: <input type="text" onB ...
- HTML 使用CSS 如何去掉文本聚焦框 HTML 使用CSS 如何去掉文本聚焦框 : outline 值设为none 修改input、textarea输入框placeholder样式
HTML 使用CSS 如何去掉文本聚焦框 : outline 值设为none 修改input.textarea输入框placeholder样式 兼容性代码: input::-webkit-input ...
- jquery多种方式实现输入框input输入时的onput,onpropertychange,onchange触发事件及区别
有关inputs输入内容的事件监听,一般我们会想到下面几个关键词:onput,onpropertychange,onchange onput与onchange的一个区分 onput:该事件在 < ...
- EL表达式 EL函数 自定义el函数 《黑马程序员_超全面的JavaWeb视频教程vedio》
\JavaWeb视频教程_day12_自定义标签JSTL标签库,java web之设计模式\day12_avi\12.EL入门.avi; EL表达式 1. EL是JSP内置的表达式语言! * jsp2 ...
- input中blur失去焦点事件与点击事件冲突时如何解决
方法一 使用setTimeout $(function(){ $(".cy-name-input input").on({ focus:function() { $(". ...
- 后台拼接input 后,动态获取input的值
//前台 <input id=" /> //后台 string text = request.form["text"].toString();
- jquery input 下拉框(模拟select控件)焦点事件
本章主要讲解如何实现select下拉列表可输入效果 ps:input提供输入,然后用ul去模拟一个select下拉列表效果即可,关键在于点击div之外的地方隐藏ul,下面是html基本结构: < ...
- html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。
关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...
随机推荐
- php strcasecmp()函数 语法
php strcasecmp()函数 语法 作用:比较两个字符串(不区分大小写)直线电机驱动器 语法:strcasecmp(string1,string2) 参数: 参数 描述 string1 必须, ...
- linux内核源码——内存管理:段页式内存及swap
os的内存管理大概可以分成两块:1.段页式管理(虚存)2.swap in 和 swap out 段页式管理 段式管理的图像:运行时重定位 多级页表的管理图像 块表加速 用户(程序员)希望用段,物理内 ...
- java 通过反射获取类属性结构,类方法,类父类及其泛型,类,接口和包
首先自定义三个类 package reflection1; public interface MtInterface { void info(); } package reflection1; imp ...
- <三剑客> 老大:awk命令用法
awk是一种编程语言,用于在linux/unix下对文本和数据进行处理.数据可以来自标准输入(stdin).一 个或多个文件,或其它命令的输出.它支持用户自定义函数和动态正则表达式等先进功能,是lin ...
- 分享几套bootstrap后台模板【TP5版】
分享几套bootstrap后台模板[TP5版],模板来源于网络,需要的拿走.1.AdminLTE 链接: http://pan.baidu.com/s/1o7BXeCM 密码: zfhy 2.Boot ...
- JS 時間戳轉日期格式
1.日期轉換為時間戳,(如果日期格式為時間戳,將其轉為日期類型,否則輸出傳入的數據) // 如果時間格式為時間戳,將其轉為日期 function timestampToDate(timestamp) ...
- windows10激活
(1).首先,我们先查看一下Win10正式专业版系统的激活状态:按住win+r键,运行命令提示符,输入slmgr.vbs -xpr,点击确定,查看系统的状态是什么时候到期或者是处于通知状态. (2). ...
- SetWindowsHookEx 其他进程的 记录
SetWindowsHookEx( WH_GETMESSAGE,CallWndProc, HInstance, h2); WH_GETMESSAGE 这个类型 hook 其他窗体的 线程是正常的 ...
- Cocos2d-x之Menu
| 版权声明:本文为博主原创文章,未经博主允许不得转载. cocos2d-x菜单简介: 菜单也是游戏开发中的重要环节,一般游戏开始的第一个画面都是游戏主菜单,这些菜单包括,开始游戏,游戏设置,关卡 ...
- python基础--冒泡排序
1.冒泡排序 1.首先用一张图来形象描述一下冒泡排序: 2.废话不多说,直接上代码 # 1.导入随机模块 import random # 2.定义一个列表,列表内的元素为20个100以内的随机整数 l ...