iso移动端input的bug解决(vue)
iso中input很奇怪,点击空白地方,键盘也不会消失,影响页面中其他功能
解决办法: 点击的元素不是input或者textarea,那么就让上一个获得焦点的输入框失去焦点。
涉及的代码:
<input type="tel" @focus="isohide($event)">
var iso = false;
var nowinput = null;
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return {
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
};
if(browser.versions.ios){
iso = true;
}
function docTouchend (event){
if (!(event.target.nodeName === 'INPUT' || event.target.nodeName === 'TEXTAREA')) {
setTimeout(function(){
nowinput.blur();
window.scrollBy(0,10); // 解决失去焦点后,苹果的页面窗口可能卡住,让滚动条滚动一点即可。
document.removeEventListener('touchend', docTouchend,false);
}, 300);
}
}; vue中methods
methods: {
isohide: function (e) {
if (iso) {
nowinput = e.target;
document.addEventListener("touchend", docTouchend, false);
}
}
}
iso移动端input的bug解决(vue)的更多相关文章
- 20150203一些移动端H5小bug解决
都是一些我也不知道为什么会有的bug. 1. 在三星note2,小米2,页面加载后,页面有黑块. 那么提高被盖住的部分z-index. 2. iphone5 ,ios7.0.4,上文字显示不出 那么就 ...
- 移动端input中的placeholder属性垂直
今天做项目时发现,在手机端用placeholder时,Android手机可以垂直显示:ISO则不能使placeholder垂直;解决办法: .gcddfadf-con-pay-1 input::-we ...
- [移动端WEB] 移动端input标签按钮为什么在苹果手机上还有一层白色?
移动端input标签按钮为什么在苹果手机上还有一层白色? 解决办法:其实蛮简单的,就加一个属性就好了 input { outline:0px ; -webkit-appearance: none; } ...
- css---移动端网站专属BUG【苹果手机】
最近在前端写页面的时候,遇到了三个苹果手机的专属BUG,记录下... BUG1:苹果手机 form 表单的input有阴影 解决方法: input { /* 1 */ overflow: visibl ...
- 如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法
如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法 用过vue的人估计都用过scoped样式属性,但有时候需要穿透样式,啥办? 很多资料都说用>>> 或 ...
- 移动端遇到的bug (长期更新)
移动端遇到的bug border-radius和transform在一起的bug 当父级设置了border-radius+overflow:hidden的时候,圆角是可以包住子级的,这是个很常见的场景 ...
- 移动端input输入框把页面顶起, 收起键盘页面复原不了问题
我相信大家平时也会遇到这种问题, 移动端 input 或者 textarea获取光标, 整个页面被顶起来, 键盘收起, 页面不复原的问题 ====>>>> 我这边提供两种解决 ...
- 百度编辑器ueditor 异步加载时,初始化没办法赋值bug解决方法
百度编辑器ueditor 异步加载时,初始化没办法赋值bug解决方法 金刚 前端 ueditor 初始化 因项目中使用了百度编辑器——ueditor.整体来说性能还不错. 发现问题 我在做一个编辑页面 ...
- paip.c3p0 nullpointexcept 配置文件根路径读取bug 解决
paip.c3p0 nullpointexcept 配置文件根路径读取bug 解决 windows ok linux犯错误... 查看loging, 初始化的时候儿jdbcurl,user,pwd都是 ...
随机推荐
- Jmeter设置默认中文页面
方法一(从网上看到的) 启动Jmeter找到 options >choose language >chinese(简体繁体自己选). 这样设置后界面就变成了中文,但是当我们下次打开时又恢复 ...
- html转markdown网站
戳下面的链接,可以直接复制富文本粘贴编程markdown: https://euangoddard.github.io/clipboard2markdown/
- Spring Boot Thmeleaf的语法 day04
一.Thmeleaf语法的使用 html格式的页面放在classpath:/templates/就会自动渲染. 1.在pom.xml导入 <dependency> <groupId& ...
- 2017(5)软件架构设计,web系统的架构设计,数据库系统,分布式数据库
试题五(共 25 分) 阅读以下关于 Web 系统架构设计的叙述,在答题纸上回答问题1 至问题 3. [说明] 某公司开发的 B2C 商务平台因业务扩展,导致系统访问量不断增大,现有系统访问速度缓慢, ...
- sqlplus用户登录
1.运行SQLPLUS工具 C:\Users\wd-pc>sqlplus 2.直接进入SQLPLUS命令提示符 C:\Users\wd-pc>sqlplus /nolog 3.以OS身份连 ...
- 2018-2019-2 20165236郭金涛《网络对抗》Exp1 PC平台逆向破解
2018-2019-2 20165236郭金涛<网络对抗>Exp1 PC平台逆向破解 一.实验内容 1.掌握NOP, JNE, JE, JMP, CMP汇编指令的机器码(0.5分) 2.掌 ...
- The world is in my hands
Null项 其实我还是比较希望你能理解我的心情 无聊666回味
- Pyenv部署
一.Git克隆方式 1.安装git yum -y install git 2.克隆pyenv到本地 git clone https://github.com/pyenv/pyenv.git ~/.py ...
- web_app框架
web app 建立在asyncio的基础上,因此用aiohttp写一个基本的app.py import logging; logging.basicConfig(level=logging.INFO ...
- Python练习:爬虫练习,从一个提供免费代理的网站中爬取IP地址信息
西刺代理,http://www.xicidaili.com/,提供免费代理的IP,是爬虫程序的目标网站. 开始写程序 import urllib.requestimport re def open_u ...