H5在IOS手机上点击会存在延迟,因此需要引入 fastclick 来解决问题
<script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
<script>
if ("addEventListener" in document) {
document.addEventListener(
"DOMContentLoaded",
function () {
FastClick.attach(document.body);
},
false
);
}
</script>
但是此时会存在另一个问题:点击输入框无法立刻获取到焦点,解决如下:
let deviceIsWindowsPhone = navigator.userAgent.indexOf("Windows Phone") >= 0;
let deviceIsIOS =
/iP(ad|hone|od)/.test(navigator.userAgent) && !deviceIsWindowsPhone;
FastClick.prototype.focus = function (targetElement) {
let length;
if (
deviceIsIOS &&
targetElement.setSelectionRange &&
targetElement.type.indexOf("date") !== 0 &&
targetElement.type !== "time" &&
targetElement.type !== "month" &&
targetElement.type !== "email"
) {
length = targetElement.value.length;
targetElement.focus();
targetElement.setSelectionRange(length, length);
} else {
targetElement.focus();
}
};