h5页面在ios系统出现的bug

1、el-select下拉框在上需要点击两次才能选中

解决方法：

.el-scrollbar {
  .el-scrollbar__bar {
    opacity: 1 !important;
  }
}

2、el-input聚焦时页面放大

解决方法1：meta

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

方法2：用JavaScript强制修改：

window.onload = function () {
  document.addEventListener('gesturestart', function (e) {
    e.preventDefault();
  });
  document.addEventListener('dblclick', function (e) {
    e.preventDefault();
  });
  document.addEventListener('touchstart', function (event) {
    if (event.touches.length > 1) {
      event.preventDefault();
    }
  });
  var lastTouchEnd = 0;
  document.addEventListener('touchend', function (event) {
    var now = (new Date()).getTime();
    if (now - lastTouchEnd <= 300) {
      event.preventDefault();
    }
    lastTouchEnd = now;
  }, false);
}

3、el-input文字超出不能滑动

解决方法：

<el-input
  v-model="dataForm.partEn"
  placeholder="请输入"
  :type="wapType == true ? 'textarea' : ''"
  autosize
></el-input>
//wapType判断是否是iso系统

进入前端入门建站教程官网入口

巨魔商店应用功能特点介绍及GitHub官网地址

H5页面向上滑动加载下一页的功能具体实现代码

"iOS 17.4 Beta版开放侧载功能，遗憾的是，iPad用户无法享受这一新特性

ios系统关闭验证通道怎么强制降级设置

苹果商店如何下载旧版本APP的方法

标签： h5, h5页面, ios系统

上面是“h5页面在ios系统出现的bug”的全面内容，想了解更多关于 vuejs 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_2033.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！