H5开发面试常见问题

本文整理了 H5 面试中常见的问题，包括如何解决移动端点击事件 300ms 的延迟，h5 输入框被键盘遮挡，overflow: scroll 在移动端滚动不流畅等问题

如何解决移动端点击事件 300ms 的延迟

• 使用 fastclick
• 使用 touchstart 代替 click 事件

h5 输入框被键盘遮挡问题

if (/Android [4-6]/.test(navigator.appVersion)) {
  window.addEventListener("resize", function () {
    if (document.activeElement.tagName == "INPUT" || document.activeElement.tagName == "TEXTAREA") {
      window.setTimeout(function () {
        document.activeElement.scrollIntoViewIfNeeded();
      }, 0);
    }
  });
}

overflow: scroll 在移动端滚动不流畅

只需要配置 -webkit-overflow-scrolling 为 touch 即可

-webkit-overflow-scrolling: touch;

禁止 iOS 识别电话

<meta content="telephone=no" name="format-detection" />