今天遇到个问题,我在手机做一个选择生日的功能,但是当我点击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. Java知多少(44)异常类型

    所有异常类型都是内置类Throwable的子类.因此,Throwable在异常类层次结构的顶层.紧接着Throwable下面的是两个把异常分成两个不同分支的子类.一个分支是Exception. 该类用 ...

  2. Caltech数据使用详情

    Caltech官网: http://www.vision.caltech.edu/Image_Datasets/CaltechPedestrians/ 以Caltech测试集为例(大概是4095个图片 ...

  3. java.lang.ClassCastException: net.sf.ezmorph.bean.MorphDynaBean cannot be cast to

    Java.lang.ClassCastException: net.sf.ezmorph.bean.MorphDynaBean cannot be cast to 在使用JSONObject.toBe ...

  4. react报错this.setState is not a function

    当报错这个的时候就要看函数是否在行内绑定this,或者在constructor中绑定this. 我这里犯的错误的是虽然我在constructor中绑定了this,但是语法写的不正确. 错误示范: co ...

  5. 【01月22日】A股滚动市盈率PE最低排名

    深康佳A(SZ000016) - 滚动市盈率PE:1.55 - 滚动市净率PB:1.03 - 滚动年化股息收益率:4.71% - - - 深康佳A(SZ000016)的历史市盈率走势图 华菱钢铁(SZ ...

  6. [Optimization] Advanced Dynamic programming

    这里主要是较为详细地理解动态规划的思想,思考一些高质量的案例,同时也响应如下这么一句口号: “迭代(regression)是人,递归(recursion)是神!” Video series for D ...

  7. ios开发之--给WebView加载进度条

    不是新东西,就是在项目里面用到H5页面的时候,中间加载延迟的时候,在最上面加载一个进度条,代码如下: // 获取屏幕 宽度.高度 bounds就是屏幕的全部区域 #define KDeviceWidt ...

  8. Win10系统安装过程小记

    1.网上下载ghost系统http://win10.jysmac.cn/win1064.html 2.使用系统自带的激活工具激活 3.到windows官网下载更新工具更新系统,重新安装https:// ...

  9. Javascript--数组转换成字符串

    定义和用法 toString() 方法可把数组转换为字符串,并返回结果. 语法 arrayObject.toString() 返回值 arrayObject 的字符串表示.返回值与没有参数的 join ...

  10. python的数据结构之栈

    栈是一种特殊的列表,栈内的元素只能通过列表的一端访问,这一端称为栈顶.栈被称为一种后入先出(LIFO,last-in-first-out)的数据结构. 由于栈具有后入先出的特点,所以任何不在栈顶的元素 ...