2022-03-23 05:29:19 来源 : 软件开发网
最近做微信公众号页面，因为入口不同，需要把公共页面抽取出来，然后根据不同的值，传递给后台不同的入口。刚开始用iframe页面嵌套（第一次尝试使用），但发现iOS系统对iframe嵌套页面的高度和定位控制的不到位，具体表现为，当嵌套的子页面的高度大于父页面的高度，且子页面中有触发弹框事件时，这时，如果子页面高度远远大于父页面高度，就会出现弹框找不到的情况，其实可能是在视口以下，弹框的位置只是相对于子页面来定位，并没有相对于视口定位。
尝试了好多种方法，均不理想，而安卓系统则表现良好，于是想到，iOS系统可直接做页面跳转，而安卓系统则正常使用iframe（如果安卓系统直接做页面跳转，会有问题，故使用iframe），
直接看代码：
网上申请 <script src="js/zepto.min.js"></script> <script> $(function() { var originId = sessionStorage.setItem("originId", "3"); //originId为后台需要判断是哪个入口的值 var u = navigator.userAgent; var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 if (isAndroid) { //安卓终端使用iframe var winH = $(window).height(); var iframe = document.createElement("iframe"); iframe.src = "index_common.html"; iframe.style.width = "100%"; iframe.style.height = winH + "px"; iframe.style.border = "0 none"; iframe.setAttribute("scrolling", "auto"); document.body.appendChild(iframe); } else if (isiOS) { //iOS终端直接页面跳转 location.href = "index_common.html"; } else { location.href = "index_common.html"; } }) </script>以上这篇ios 不支持 iframe 的完美解决方法(兼容iOS&安卓)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。
关于我们 加入我们 广告服务 网站地图
All Rights Reserved, Copyright 2004-2020 www.830036.com
如有意见请与我们联系 邮箱：435 227 67@qq.com
营业执照公示信息