zhuli 3 недель назад
Родитель
Сommit
8ec4a90a04
1 измененных файлов с 54 добавлено и 58 удалено
  1. 54 58
      HBuilderProjects/shareIndex.html

+ 54 - 58
HBuilderProjects/shareIndex.html

@@ -469,23 +469,36 @@
 			pointer-events: auto;
 		}
 
-		#fabWrapWx {
+		.fab-dock__inner {
+			position: relative;
+			width: 100%;
+			max-width: 320px;
+			height: 48px;
+			margin: 0 auto;
+		}
+
+		/* 开放标签透明盖在可见按钮上;勿隐藏底层 #openApp,否则 wx.ready 后会像「按钮消失」 */
+		.fab-wx-layer {
 			display: none;
+			position: absolute;
+			left: 0;
+			right: 0;
+			top: 0;
+			height: 48px;
+			z-index: 2;
+			pointer-events: auto;
 		}
 
-		#fabWrapWx.is-active {
+		#fabDock.wx-launch-ready .fab-wx-layer {
 			display: block;
-			pointer-events: auto;
 		}
 
-		/* 开放标签宿主必须有明确宽高,否则微信内 Shadow 内容可能不占位、看起来像「没按钮」 */
 		#launch-btn {
 			display: block;
 			width: 100%;
-			max-width: 320px;
 			height: 48px;
 			min-height: 48px;
-			margin: 0 auto;
+			margin: 0;
 			pointer-events: auto;
 			overflow: visible;
 		}
@@ -988,40 +1001,32 @@
 			<div id="staffGroupsMount"></div>
 		</section>
 	</div>
-	<!-- 微信内:wx-open-launch-app(需 JSSDK 签名 + 公众号关联 App);非微信见 #fabWrapFallback -->
-	<div id="fabWrapWx" class="fab-wrap" aria-hidden="true">
-		<wx-open-launch-app id="launch-btn" appid="wx5598889b28511717">
-			<script type="text/wxtag-template">
-				<style>
-					.wx-open-app-btn {
-						display: block;
-						width: 100%;
-						max-width: 320px;
-						height: 48px;
-						margin: 0 auto;
-						padding: 0;
-						border: none;
-						background: transparent;
-						cursor: pointer;
-					}
-					.wx-open-app-btn img {
-						display: block;
-						width: 100%;
-						height: 48px;
-						object-fit: contain;
-					}
-				</style>
-				<button class="wx-open-app-btn" aria-label="APP内打开">
-					<img src="images/uBtn.png" alt="APP内打开" />
-				</button>
-			</script>
-		</wx-open-launch-app>
-		<div class="home-indicator" aria-hidden="true"></div>
-	</div>
-	<div id="fabWrapFallback" class="fab-wrap">
-		<button type="button" class="fab" id="openApp">
-			<img src="images/uBtn.png" alt="APP内打开" decoding="async">
-		</button>
+	<!-- 底层 #openApp 始终可见;微信 JSSDK 成功后 #fabWxLayer 透明叠加以唤起 App -->
+	<div id="fabDock" class="fab-wrap">
+		<div class="fab-dock__inner">
+			<button type="button" class="fab" id="openApp">
+				<img src="images/uBtn.png" alt="APP内打开" decoding="async">
+			</button>
+			<div id="fabWxLayer" class="fab-wx-layer" aria-hidden="true">
+				<wx-open-launch-app id="launch-btn" appid="wx5598889b28511717">
+					<script type="text/wxtag-template">
+						<style>
+							.wx-open-hit {
+								display: block;
+								width: 100%;
+								height: 48px;
+								margin: 0;
+								padding: 0;
+								border: none;
+								opacity: 0;
+								background: transparent;
+							}
+						</style>
+						<button class="wx-open-hit" aria-label="APP内打开">打开</button>
+					</script>
+				</wx-open-launch-app>
+			</div>
+		</div>
 		<div class="home-indicator" aria-hidden="true"></div>
 	</div>
 	<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
@@ -1444,26 +1449,15 @@
 		}
 
 		function setFabLaunchMode(mode) {
-			var wxWrap = document.getElementById('fabWrapWx');
-			var fbWrap = document.getElementById('fabWrapFallback');
+			var dock = document.getElementById('fabDock');
+			var layer = document.getElementById('fabWxLayer');
+			if (!dock) return;
 			if (mode === 'wx') {
-				if (wxWrap) {
-					wxWrap.classList.add('is-active');
-					wxWrap.setAttribute('aria-hidden', 'false');
-				}
-				if (fbWrap) {
-					fbWrap.style.display = 'none';
-					fbWrap.setAttribute('aria-hidden', 'true');
-				}
+				dock.classList.add('wx-launch-ready');
+				if (layer) layer.setAttribute('aria-hidden', 'false');
 			} else {
-				if (wxWrap) {
-					wxWrap.classList.remove('is-active');
-					wxWrap.setAttribute('aria-hidden', 'true');
-				}
-				if (fbWrap) {
-					fbWrap.style.display = '';
-					fbWrap.removeAttribute('aria-hidden');
-				}
+				dock.classList.remove('wx-launch-ready');
+				if (layer) layer.setAttribute('aria-hidden', 'true');
 			}
 		}
 
@@ -1479,6 +1473,8 @@
 			tag.addEventListener('error', function (e) {
 				var detail = e && e.detail;
 				console.warn('[wx-open-launch-app]', detail);
+				weChatJssdkConfigured = false;
+				setFabLaunchMode('scheme');
 				var errMsg =
 					detail && detail.errMsg
 						? String(detail.errMsg)