移动端H5页面屏蔽双击放大的功能

我写这套博客程序的时候，在iPhone手机safari上预览，快速双击页面任意位置，页面会被放大。被放大的程度，是刚好抵消主div框架设置的左右两边的margin。而我，不想要这样的功能！

在网上搜索，iPhone禁止页面双击放大，得到的答案大多是设置meta标签viewport：

<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />

早几年前，上面这行代码还挺好用。而现在，随着iOS系统的更新升级，此方法已经不管用了。

继续在网上搜索，找到了新的解决方案，是用JS屏蔽touch事件，代码如下（本站JS文件就包含此代码）：

var lastTouchEnd = 0;
document.documentElement.addEventListener('touchend', function (event) {
    var now = Date.now();
    if (now - lastTouchEnd <= 300) {
        event.preventDefault();
    }
    lastTouchEnd = now;
}, false);

原理是，判断两次touch事件的时间间隔，如果间隔在300毫秒以内，则阻止第二个touch事件。

这段JS代码来源参考：https://www.cnblogs.com/xielisen/p/9488532.html

touch间隔300毫秒的扩展阅读：https://www.jianshu.com/p/6e2b68a93c88