自己在一个微信项目优化过程遇到一个问题，所以记录下来。废话不说，下面进入正题。

1.添加meta便签

首先解决移动端浏览器放大问题一般是添加一个meta便签，防止用户手动放大网页问题。

该meta标签的作用是让当前viewport的宽度等于设备的宽度，同时不允许用户手动缩放。也许允不允许用户缩放不同的网站有不同的要求，但让viewport的宽度等于设备的宽度，这个应该是大家都想要的效果，如果你不这样的设定的话，那就会使用那个比屏幕宽的默认viewport，也就是说会出现横向滚动条。

width:

控制 viewport 的大小，可以指定的一个值或者特殊的值，如 device-width 为设备的宽度（单位为缩放为 100% 时的 CSS 的像素）。

height:

和 width 相对应，指定高度。

initial-scale:

初始缩放。即页面初始缩放程度。这是一个浮点值，是页面大小的一个乘数。例如，如果你设置初始缩放为“1.0”，如果你设置为“2.0”，那么这个页面就会放大为2倍。

maximum-scale:

最大缩放。即允许的最大缩放程度。这也是一个浮点值，用以指出页面大小与屏幕大小相比的最大乘数。例如，如果你将这个值设置为“2.0”，那么这个页面最多能放大2倍。

user-scalable:

用户调整缩放。即用户是否能改变页面缩放程度。如果设置为yes则是允许用户对其进行改变，反之为no。默认值是yes。如果你将其设置为no，那么minimum-scale 和 maximum-scale都将被忽略，因为根本不可能缩放。

以上设置完毕之后，在一般浏览器上已经实现了阻止用户手动放大页面。但是在ios safari浏览器上进行测试，发现双击页面，页面还是会放大，那么我们进行下一步的设置。

 

2.阻止click事件的触发

我们认识的click事件在移动端浏览器其实是默认完整touchstart-touchend这两个事件的触发，只要阻止其中的一个事件触发就能阻止click事件，那么有人会说为什么不直接禁止掉click事件的触发？其实如果你没有点击的事件的需求的话，

完全可以这么做。但是一般的页面都还是需要点击的事件触发的。那么在这里，我们的思路可以用touchstart事件来代替click事件来进行点击事件的触发，只要阻止touchend事件的默认事件就可以的。

$('body').on('touchend',function(e) {            e.preventDefault();        });

这样就可以满足点击事件的触发，又可以阻止在ios safari浏览器出现页面双击放大。