解决IOS中input失焦后，页面上移，点击不了问题

nevermind 发布于2019-08-23 14:58 / 2621人阅读

摘要：在失焦后，发现的页面会停止不下来，并且页面上的输入框，按钮点击事件，全部都移位了，需要滑动一下才可以正常。

IOS在Input失焦后，发现body的页面会停止不下来，并且页面上的输入框，按钮点击事件，全部都移位了，需要滑动一下才可以正常。

下面是解决方法，可全局引用：

var u = navigator.userAgent;
  var flag;
  var myFunction;
  var isIOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/);
  if (isIOS) {
    document.body.addEventListener("focusin", () => {  //软键盘弹起事件
      flag = true;
      clearTimeout(myFunction);
    })
    document.body.addEventListener("focusout", () => { //软键盘关闭事件
      flag = false;
      if (!flag) {
        myFunction = setTimeout(function () {
          window.scrollTo({ top: 0, left: 0, behavior: "smooth" })//重点  =======当键盘收起的时候让页面回到原始位置(这里的top可以根据你们个人的需求改变，并不一定要回到页面顶部)

        }, 200);
      } else {
        return
      }
    })
  } else {
    return
  }

GPU云服务器云服务器失焦后框失焦后 html中input python中input的用法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/101440.html

ios12中遇到的带input弹窗的错位问题

摘要：问题描述使用定位的弹窗，在的系统里，软键盘调起后，页面整体上移，当软键盘消失时，视觉上页面已经回到原始位置，但其实弹窗的焦点位置仍在软键盘调起时的位置。问题描述：使用fixed定位的弹窗，在ios12的系统里，软键盘调起后，页面整体上移，当软键盘消失时，视觉上页面已经回到原始位置，但其实弹窗的焦点位置仍在软键盘调起时的位置。解决办法：这也是参考某位大佬的解决办法 documen...

henry14 2019-08-26 13:49 评论0 收藏0
vue移动端项目中使用fastclick及遇上的issue

摘要：在项目中安装插件在中引入并绑定到在项目中安装成功后测试会遇到以下问题点击不灵敏解决方法项目中使用时点击不灵敏兼容处理在中，有一些元素如等在会出现这是因为这些元素并没有和的整型数字属性，所以一旦引用就会报错，因此排除这些属性才使用方法修复 1、在vue项目中安装fastclick插件 npm install --save fastclick 2、在main.js中引入并绑定到body i...

cod7ce 2019-08-26 10:39 评论0 收藏0
在iOS设备下，h5的input框失焦后页面被顶起来一部分bug解决

摘要：在之后，的框失焦后页面会出现被顶上去一部分的下面就来看下怎么解决这个，首先我们必须知道这两个方法软键盘弹起事件软键盘关闭事件。在iOS12之后，h5的input框失焦后页面会出现被顶上去一部分的bug,下面就来看下怎么解决这个bug，首先我们必须知道这两个方法focusin(软键盘弹起事件)、focusout(软键盘关闭事件)。注意：这里的input框的位置是在页面的底部废话不多说...

xiguadada 2019-08-23 14:51 评论0 收藏0
React中使用UEditor

摘要：前言本文将介绍笔者在的项目中使用百度的富文本编辑器的过程。以百度官网的为例，控制台输入为该编辑器注册点击事件，当点击加粗按钮时，控制台输出为了避免点击工具条时触发事件，笔者将自定义的事件全部注释了。前言本文将介绍笔者在React的项目中使用百度的富文本编辑器Ueditor的过程。注意本文不提供一条龙式的使用方法，只是将使用过程中的一些实现思路进行总结，供以参考。react项目中导入...

firim 2019-08-26 12:17 评论0 收藏0