今天遇到个问题,我在手机做一个选择生日的功能,但是当我点击input框时,事件选择插件和输入法都弹出来了,很丑,然后就想阻止输入法弹出来,

网上一个方法是:在input框的获取焦点事件里,主动触发失去焦点事件,这样就阻止输入法的弹出了,很好,上个代码:

<input type="text" class="nameInput birthDayInput" placeholder="点击选择生日日期" @focus="openPicker()" v-model="comInfo.birthday">
openPicker() {
document.activeElement.blur();//主动触发onblur事件,是原生的js哟
this.$refs.picker.open();//这个方法不要管,是其它代码
},

主动触发input框的失去焦点事件,阻止输入法跳出的更多相关文章

  1. 【JS】 伪主动触发input:file的click事件

    大家用到input:file标签时,对于input:file的样式难看的处理方法一般有2种: 采用透明化input:file标签的方法,上面放的input:file标签,下面放的是其他标签,实际点击的 ...

  2. input中blur失去焦点事件与点击事件冲突时如何解决

    方法一 使用setTimeout $(function(){ $(".cy-name-input input").on({ focus:function() { $(". ...

  3. 通过定时监听input框来实现onkeyup事件-

    问题:因为zepto无法使用onkeyup 事件 解决方法:通过给input框绑定focus 事件,定时的去监听input的值得改变,在鼠标移出input后,清除定时器 <!DOCTYPE ht ...

  4. 如何让input框自动获得焦点

    项目中有个需求  一个用扫描枪输入的input框 为了避免每次都需要人为点击 需要做成当打开页面时该input框自动获取焦点 <input type="text" name= ...

  5. input固定定位后,当input框获取到焦点时,会离开手机软键盘的解决方法

    前些天做页面时候遇到这样一个问题,将input框用position:fixed固定定位在最底部的时候,当Input获取焦点的时候,input框离开了手机软键盘,而不是吸附在软键盘上,效果如下图: 找了 ...

  6. 在JS/jQuery中,怎么触发input的keypress/keydown/keyup事件?

    怎么触发keypress/keydown/keyup事件? 问题: 1.在之前的写的input后面添加了搜索按钮 2.input只有keyup事件,如下: $("#desktop_folde ...

  7. Vue触发input选取文件点击事件

    CSS .upload-btn-box { margin-bottom: 10px; button { margin-right: 10px; } input[type=file] { display ...

  8. html如何点击子元素事件而不触发父元素的点击事件——阻止冒泡

    如果子元素和父元素都有点击事件,会出现点击事件冒泡的情况. 1.如何避免冒泡: html: <html> <head></head> <body> &l ...

  9. 吐血bug-- 多个input框接连blur事件导致alert接连弹出

    本来今天想记录一下Flow在vue源码中的应用,结果临时触发了个bug... bug描述: elementUi + Vue 技术 需求:一个表格中有至少两条数据,每条数据都有input框,在失去焦点后 ...

随机推荐

  1. 【emWin】例程十七:窗口对象——Button

    介绍: 按钮小工具通常用作触摸屏的主要用户界面元素,本例程介绍按钮小工具的创建及使用方法. 触摸校准(上电可选择是否进入校准界面) 自绘按钮(通过回调函数来自行绘制各种形状的按钮) 设置按钮字体 设置 ...

  2. 命令查看linux主机配置

    查看cpu: # 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 # 查看物理CPU个数 cat /proc/cp ...

  3. maven一键部署tomcat war包

    1.环境如下 eclipse.apache-maven-3.0.5.apache-tomcat-7.0.39 2.配置如下 apache-tomcat-7.0.39配置C:\Program Files ...

  4. Scala学习笔记(一):入门

    变量定义 Scala有两种变量,val和var.val类似于Java中的final变量,一旦初始化了,val就不能再被赋值.var可以多次赋值.但由于函数式编程特性,Scala更推崇val. var的 ...

  5. SparkSQL demo

    1.数据样本:data1.txt xiaoming,25,chengduxiaohua,23,beijingliuyang,16,hangzhouxiaoqiang,19,zhejiang 2.dem ...

  6. 132、Android安全机制(2) Android Permission权限控制机制(转载)

    http://blog.csdn.net/vshuang/article/details/44001661 http://www.cnblogs.com/mengdd/p/4892856.html

  7. PhoneGap 数据库操作

    1,openDatabase phonegap官方文档中已经很清楚的标明,如果使用一个数据库首先要用window对象进行创建: var dbShell = window.openDatabase(na ...

  8. 遍历DOM打平

    html 模板 <div class="box"> <p>1</p> <p>2</p> <div> < ...

  9. .NET Core开发日志——Middleware

    熟悉ASP.NET架构的开发者一定对于HTTP Modules与HTTP Handlers不陌生.两者的作用主要是对网络请求执行特定的处理工作.而在.NET Core中,它们都被Middleware( ...

  10. [No0000C5]VS2010删除空行

    VS2010删除空行,查找内容:^:b*$\n,替换为:,查找范围:当前文档,使用:正则表达式