在微信瀏覽器中打開H5網頁進行了連續的頁面操作，某一步微信不支持需要引導用戶“使用瀏覽器打開網頁”，到達外置瀏覽器進行該步操作后需要跳轉回微信瀏覽器繼續進行下一步操作，如何實現？為了解決這個問題，做了漂亮的引導頁面，可以根據ios/android兩個設備進行顯示引導
素材下載地址：http://www.68xi.com/1109.html
代碼如下：
<!DOCTYPE html>
<html>
<head>
<title>在瀏覽器打開</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="color-scheme" content="light dark">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style type="text/css">
*{
margin:0;
padding:0;
}
#topyd{
width: 100%;
margin:0 auto;
position: fixed;
top: 0;
}
#topyd img{
max-width: 100%;
}
#centeryd{
width: 320px;
margin:180px auto 0;
}
#centeryd img{
max-width: 320px;
}
#bottomyd{
width: 320px;
margin:30px auto 0;
}
#bottomyd p{
text-align: center;
font-size: 18px;
color: #174ded;
font-weight: bold;
}
</style>
</head>
<body>
<!-- 頂部引導 -->
<div id="topyd"></div>
<!-- 中部引導 -->
<div id="centeryd">
<img src="iosydt.jpg">
</div>
<!-- 底部引導 -->
<div id="bottomyd">
<p>本站不支持在微信打開</p>
<p>請在瀏覽器打開訪問</p>
</div>
</body>
<!-- 判斷瀏覽器 -->
<script>
var ua = navigator.userAgent.toLowerCase();
var isWeixin = ua.indexOf('micromessenger') != -1;
var isAndroid = ua.indexOf('android') != -1;
var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
// 判斷是不是在微信客戶端打開
if(isWeixin) {
// 判斷是在Android的微信客戶端還是Ios的微信客戶端
if (isAndroid) {
// 是在Android的微信客戶端
$("#topyd").html("<img src='android.jpg'/>");
$("#centeryd").html("<img src='androidydt.jpg'/>");
}else if (isIos) {
// 是在Ios的微信客戶端
$("#topyd").html("<img src='ios.jpg'/>");
$("#centeryd").html("<img src='iosydt.jpg'/>");
}else{
// 未知設備系統，默認使用安卓的引導方式
$("#topyd").html("<img src='android.jpg'/>");
$("#centeryd").html("<img src='androidydt.jpg'/>");
}
}
</script>
</html>