主动触发input框的失去焦点事件,阻止输入法跳出
今天遇到个问题,我在手机做一个选择生日的功能,但是当我点击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框的失去焦点事件,阻止输入法跳出的更多相关文章
- 【JS】 伪主动触发input:file的click事件
大家用到input:file标签时,对于input:file的样式难看的处理方法一般有2种: 采用透明化input:file标签的方法,上面放的input:file标签,下面放的是其他标签,实际点击的 ...
- input中blur失去焦点事件与点击事件冲突时如何解决
方法一 使用setTimeout $(function(){ $(".cy-name-input input").on({ focus:function() { $(". ...
- 通过定时监听input框来实现onkeyup事件-
问题:因为zepto无法使用onkeyup 事件 解决方法:通过给input框绑定focus 事件,定时的去监听input的值得改变,在鼠标移出input后,清除定时器 <!DOCTYPE ht ...
- 如何让input框自动获得焦点
项目中有个需求 一个用扫描枪输入的input框 为了避免每次都需要人为点击 需要做成当打开页面时该input框自动获取焦点 <input type="text" name= ...
- input固定定位后,当input框获取到焦点时,会离开手机软键盘的解决方法
前些天做页面时候遇到这样一个问题,将input框用position:fixed固定定位在最底部的时候,当Input获取焦点的时候,input框离开了手机软键盘,而不是吸附在软键盘上,效果如下图: 找了 ...
- 在JS/jQuery中,怎么触发input的keypress/keydown/keyup事件?
怎么触发keypress/keydown/keyup事件? 问题: 1.在之前的写的input后面添加了搜索按钮 2.input只有keyup事件,如下: $("#desktop_folde ...
- Vue触发input选取文件点击事件
CSS .upload-btn-box { margin-bottom: 10px; button { margin-right: 10px; } input[type=file] { display ...
- html如何点击子元素事件而不触发父元素的点击事件——阻止冒泡
如果子元素和父元素都有点击事件,会出现点击事件冒泡的情况. 1.如何避免冒泡: html: <html> <head></head> <body> &l ...
- 吐血bug-- 多个input框接连blur事件导致alert接连弹出
本来今天想记录一下Flow在vue源码中的应用,结果临时触发了个bug... bug描述: elementUi + Vue 技术 需求:一个表格中有至少两条数据,每条数据都有input框,在失去焦点后 ...
随机推荐
- Java知多少(38)抽象类的概念和使用
在自上而下的继承层次结构中,位于上层的类更具有通用性,甚至可能更加抽象.从某种角度看,祖先类更加通用,它只包含一些最基本的成员,人们只将它作为派生其他类的基类,而不会用来创建对象.甚至,你可以只给出方 ...
- [JS] ECMAScript 6 - Set & Map : compare with c#
Ref: Set 和 Map 数据结构 Day 0 - 1所学
- UILabel(富文本)
本文转载至 http://www.jianshu.com/p/5d24d22f99c3 富文本 NSString *str = @"人生若只如初见,何事秋风悲画扇.\n等闲变却故人心,却道故 ...
- Failed to resolve: com.android.support:appcompat-v7:27.0.1问题解决
今天,在毫无征兆的情况下AndroidStudio又抽风了,搞了大半天,试了网上众多方案,终于解决了这个问题.咱们一步一步来 第一步:这是最开始的bug Error:Failed to resolve ...
- php: Cannot send session cache limiter
修改php.ini中的session.auto_start = 0 为 session.auto_start = 1 MAC 的php.ini 在 /private/etc/ 目录下修改的时候发现su ...
- Tomcat服务器使用和debug
1 在写程序的过程中,遇到了tomcat服务器不能重启的情况,要排查出这个错误并解决它. tomcat就像一棵树,我不能对书上的每片叶子的纹理都熟悉,我只能看到树的轮廓.好像之前出现过这个问题,在se ...
- M - Pots
You are given two pots, having the volume of A and B liters respectively. The following operations c ...
- 微信jssdk上传图片,一张一张的上传 和 一次性传好几张
//html模板 <div class="zhaopin_3_2"> <div id="bbb"></div> <im ...
- H - Gold Coins(2.4.1)
H - Gold Coins(2.4.1) Crawling in process... Crawling failed Time Limit:1000MS Memory Limit:3000 ...
- ELK之从6.3.1升级至6.6.2
需要把原6.3.1版本升级为6.6.2版本 1,官网下载rpm包 2,升级elasticsearch和kibana rpm -U elasticsearch-6.6.2.rpm rpm -U kiba ...