今天遇到了一个很奇怪的问题:在ios手机上,如果页面出现滚动条,点击select元素的时候,偶尔会出现 “ 页面上的某一个输入框自动获得焦点 “ 的问题。

这个问题困扰我好久,一直找不到答案,今天终于有点头绪。

  • 问题重现的前提:

    1:页面有selec标签

    2:有input标签

    3:y轴有滚动条

  • 问题的原因是:

    点击select,触发touchstart事件,页面的滚动条会往顶部滚,事件进行冒泡

    滚动完成后,点击的位置就是输入框所在的位置,

    之后,由于事件冒泡,触发父元素的click事件,

    之后输入框获得焦点

  

  • 解决方案:

    给select元素绑定touchstart事件,在事件里面阻止事件冒泡

    $(‘select’).on('touchstart',function(e){
      e.stopPropagation();
    });

ios上【点击select元素,输入框自动获得焦点的问题】的更多相关文章

  1. 关于ionic2在IOS上点击延迟的问题

    正常的点击事件, 不知道 为什么 ,在IOS上明显会延迟几百毫秒.. 加上tappable属性就可以解决了 <div tappable (click)="doClick()" ...

  2. 记录下hbuilder vue项目打包APP 在IOS上点击延迟的问题

    做的项目打包成APP在IOS 上有延迟问题,在安卓下却不会,联想到之前 用IONIC时打包的APP也是 在IOS下有300毫秒延迟问题.所以 只能 认吧. 安装fastclick 插件: npm in ...

  3. Vue在点击内部元素时(获得焦点),怎样让外部div元素样式变化?

    问题: div内部有很多元素,div. p. span .input等,各元素有嵌套,现在点击某元素时需要最外面这个div边框高亮,例如,点击了input开始输入 假设html 结构如下  <d ...

  4. 内嵌iframe页面在IOS下会受内部元素影响自动撑开的问题

    IOS下的webview页面,内嵌iframe元素,将其样式指定为宽高100%: .iframe { width: %; height: %; } 在安卓下运行均无问题,但是在IOS下会出现异常. 具 ...

  5. Jquery 在ios上事件委托失效

    点击通过js遍历出来的列表,跳转页面.点击事件委托在document上, 像这样: $(document).on("click",".nav",function ...

  6. ios上有时候提交按钮点击两次才可以取消输入框软键盘

    ios上有时候提交按钮点击两次才可以取消输入框软键盘,点击第一次软键盘消失,点击第二次输入框页面消失,这样用户体验不好.我的做法是用 touchstart 代替click来处理 反应快,但是有时候会出 ...

  7. 【转】iOS 上常用的两个功能:点击屏幕和return退出隐藏键盘和解决虚拟键盘挡住UITextField的方法

    iOS上面对键盘的处理很不人性化,所以这些功能都需要自己来实现, 首先是点击return和屏幕隐藏键盘 这个首先引用双子座的博客 http://my.oschina.net/plumsoft/blog ...

  8. 仅Firefox中A元素包含Select时点击Select不能选择option

    这是在使用京东的一个日期组件时碰到的bug,重现bug的代码精简如下 <!DOCTYPE HTML> <html> <head> <title> 仅Fi ...

  9. jQuery自动完成点击html元素

    /************************************************************************** * jQuery自动完成点击html元素 * 声 ...

随机推荐

  1. loj #6485. LJJ 学二项式定理 (模板qwq)

    $ \color{#0066ff}{ 题目描述 }$ LJJ 学完了二项式定理,发现这太简单了,于是他将二项式定理等号右边的式子修改了一下,代入了一定的值,并算出了答案. 但人口算毕竟会失误,他请来了 ...

  2. 树状数组 P3605 [USACO17JAN]Promotion Counting晋升者计数

    P3605 [USACO17JAN]Promotion Counting晋升者计数 题目描述 奶牛们又一次试图创建一家创业公司,还是没有从过去的经验中吸取教训--牛是可怕的管理者! 为了方便,把奶牛从 ...

  3. select和epoll原理和区别

    对于select和poll,其主要原理跟epoll不同 poll和select的共同点就是,对全部指定设备(fd)都做一次poll,当然这往往都是还没有就绪的,那就会通过回调函数把当前进程注册到设备的 ...

  4. 【模板】割点(割顶) Tarjan

    题目背景 割点 题目描述 给出一个nnn个点,mmm条边的无向图,求图的割点. 输入输出格式 输入格式: 第一行输入n,mn,mn,m 下面mmm行每行输入x,yx,yx,y表示xxx到yyy有一条边 ...

  5. 6.House Robber(简单版抢银行)

    Level:   Easy 题目描述: You are a professional robber planning to rob houses along a street. Each house ...

  6. 各平台安装和使用Docker的差异

    在Mac上运行Docker 使用Docker for Mac 系统要求 开启虚拟化的硬件支持,可以通过命令来检查:sysctl kern.hv_support OS X 10.10.3 或者更高版本 ...

  7. 8.9zju集训日记

    和新队员的第一次比赛,前期开题方向基本正确,签到的速度比较快,中期读了旋转卡壳,矩阵和km的三道题目,都有一定的想法,但三个人意见不同没有往一个方向想,但其实旋转卡壳和km的题目思路几乎都对了,但是旋 ...

  8. ORA-01950:no privileges on tablespace 'USERS'

    ORA-01950:no privileges on tablespace 'USERS' SQL>create user myuser identitied by password; SQL& ...

  9. linux学习四x系统指令

    一.任务调度 任务调度:系统在某个时间执行特定的命令或者程序 如: 1.对于一些需要周期性执行的一些系统指令 2.定期的病毒扫描 3.定期数据库备份等   命令:crontab 设置任务调度文件: / ...

  10. linux mysql下载地址

    linux mysql下载地址: https://dev.mysql.com/downloads/mysql/5.7.html#downloads