mui webview选项卡 首次只加载第一个页面,其余点击触发在执行

本文介绍了一种优化策略,通过调整mui Webview的加载方式,使得首次加载时仅显示第一个页面,其余页面在用户点击时按需加载,从而提升应用启动速度并改善用户体验。

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

开始做的webview 一进去就加载了所有页面,速度慢,而且弹出其他页面的弹窗,所有改进了方法,第一次进去只执行了第一个页面,其余点击后执行。代码如下:

var aniShow = {};
			//创建子页面,首个选项卡页面显示,其它均隐藏;
			mui.plusReady(function() {
				var self = plus.webview.currentWebview();
				for (var i=0; i<1; i++) {
					var sub = plus.webview.create(subpages[i].mobileHref, subpages[i].mobileHref, subpage_style, {
						parentMenuId: subpages[i].id,
						selfModelHref: subpages[i].mobileHref
					});
					if (i > 0) {  
				        sub.hide();  
				    }  
				    self.append(sub); 
					
				}
			});
			//选项卡点击事件
			mui('body').on('tap', '.mouduleBtn', function() {
				var targetTab = this.getAttribute('href');
				var targetTabId = this.getAttribute('id');

				$(".mui-table-view-cell").css("borderBottom", "");
				$(".mui-table-view-cell").css("borderRight", "");
				$(".mui-table-view-cell").css("borderLeft", "");

				var thisStyle = this.parentNode;
				thisStyle.style.borderBottom = "2px solid #FF5511";
				thisStyle.style.borderRight = "0px solid #FF5511";
				thisStyle.style.borderLeft = "0px solid #FF5511";

				if(targetTab == activeTab) {
					return;
				}
				//显示目标选项卡
				//若为iOS平台或非首次显示,则直接显示
				/*if(mui.os.ios || aniShow[targetTab]) {
					plus.webview.show(targetTab);
				} else {
					//否则,使用fade-in动画,且保存变量
					var temp = {};
					temp[targetTab] = "true";
					mui.extend(aniShow, temp);
					plus.webview.show(targetTab, "fade-in", 300);
				}*/
				var self = plus.webview.currentWebview();  
				var sub = plus.webview.create(targetTab, targetTab, subpage_style, {
						parentMenuId: targetTabId,
						selfModelHref: targetTab
					});  
				self.append(sub); 
				//隐藏当前;
				plus.webview.hide(activeTab);
				//更改当前活跃的选项卡
				activeTab = targetTab;
			});


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值