前言
在移動端如何禁止瀏覽器縮放網頁？具體需要添加網頁的元數據，即 meta 標籤。還需阻止一些事件的默認行爲。
演示
-
禁止縮放（添加
meta標籤 ）
僅僅在部分安卓瀏覽器可以生效，IOS的Safari瀏覽器無法禁止縮放 -
禁止縮放（添加
meta標籤並阻止一些事件的默認行爲）
安卓和IOS的瀏覽器都可以生效
![在這裏插入圖片描述]()
代碼
禁止縮放（添加 meta 標籤阻止一些事件的默認行爲）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>forbid-scalable-all</title>
</head>
<body>
<h1>禁止縮放</h1>
<p>添加以下meta屬性：initial-scale=1.0, maximum-scale=1.0, user-scalable=no</p>
<p>添加阻止默認行爲的腳本</p>
<script>
window.onload = function() {
var lastTouchEnd = 0;
document.addEventListener('touchstart', function(event) {
if (event.touches.length > 1) {
event.preventDefault();
}
});
document.addEventListener('touchend', function(event) {
var now = (new Date()).getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false);
document.addEventListener('gesturestart', function(event) {
event.preventDefault();
});
document.addEventListener('dblclick', function (event) {
event.preventDefault();
})
}
</script>
</body>
</html>
參考
https://blog.csdn.net/weixin_34403976/article/details/90054858