微信小程序的页面因为微信系统设置的大字体导致排版错误

最新推荐文章于 2023-10-12 15:35:58 发布

原创

最新推荐文章于 2023-10-12 15:35:58 发布

· 2.2k 阅读

1 ·

版权

文章标签：

#微信小程序 #微信 #小程序

博客讨论了如何处理客户在使用大字体设置时遇到的手机页面崩溃和显示异常的问题。通过引入JavaScript代码，在页面加载时调用微信JSBridge接口，强制设置字体大小，从而确保页面格式不受微信系统设置影响。虽然此方法可能导致短暂的乱码现象，但能有效解决适配性问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近手机端页面有客户反馈,说页面崩溃,乱的不行.

如下图

登陆后发现在我的手机里是正常的,然后客户的截图字体大的不行,一问才知道设置了微信系统中的最大字体,其实最简单的就是字体调回标准字体或者将字体字号变小一些.但是,人家是客户诶.

系统当然要有适用性

简单粗暴的解法:禁止在程序页面使用大字体,就是设置我的页面格式不受微信系统设置的影响

这个方法有一个弊端,就是打开页面后会先有乱码的页面,过了大概一秒钟以后页面就会恢复正常的格式.然后呢要放在<body>下面(这个里面没有代码注释,需要注释的小伙伴可以去看一下其他人的)

<body style="background:#fff">
<script>
    (function() {
        if (typeof WeixinJSBridge === 'object' && typeof WeixinJSBridge.invoke === 'function') {
            handleFontSize();   
        } else {
            if (document.addEventListener) {            
                document.addEventListener('WeixinJSBridgeReady', handleFontSize, false);
            } else if (document.attachEvent) {
                document.attach

最低0.47元/天解锁文章