手机、平板电脑浏览器上页面后退后自动刷新页面

最新推荐文章于 2019-05-16 23:36:32 发布

iteye_19467

最新推荐文章于 2019-05-16 23:36:32 发布

阅读量1.2k

点赞数

分类专栏：平板电脑-网页文章标签：浏览器三星 Android

平板电脑-网页专栏收录该内容

4 篇文章

订阅专栏

[size=large]手机、平板电脑浏览器上页面后退后自动刷新页面
运用场景：从九宫格导航页面跳转到其它页面后，点出浏览器的后退或设备上的后退键。要能够刷新九宫格页面。 [/size] :D

[b][size=medium]
测试设备：
GT-P1000 三星平板电脑（其实为大号手机 :D ）
操作系统：android2.1
浏览器：Mobile Safari/533.1
User Agent打印结果：
Mozilla/5.0 (Linux; U; Android 2.1; zh-cn; GT-P1000 Build/FROYO) AppleWebKit/533
.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1[/size][/b]


<head>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<!-- 以下3个标签在Mobile的文档声明中不起作用，故改用js定时器来后退时的自动刷新 -->
<--
<meta HTTP-EQUIV="pragma" CONTENT="no-cache">
<meta HTTP-EQUIV="cache-control" CONTENT="no-cache">
<meta HTTP-EQUIV="expires" CONTENT="0">
-->
</head>
<script>
/* 使用了2个定时器，一个是每分钟刷新页面，另一个是后退后刷新页面 */
var interval;

function refresh(force){
	if(force){
		//alert("强制每分钟刷新！");
		window.location.reload();
	}else if("true"==getFlag()){
		//alert("后退刷新...");
		window.location.reload();
	}
}

//flag="true"/"false" (后退状态/非后退状态)
function setFlag(flag){
	document.getElementById("isPageBack").value= flag + "";
}

function getFlag(){
	return document.getElementById("isPageBack").value;
}

//导航链接
function navigate(target){
	doClearInterval();
	setFlag(true);
	forward(target);
}

//跳转到下个页面
function forward(target){
	window.location.href="<ww:url value='/mobileNav!navigate.action'/>?navURL="+target;
}

function createInterval(){
	if(interval==undefined){
		//alert("在创建定时器："+interval);
		interval = setInterval("refresh()", 500);
	}
}

function doClearInterval(){
	if(interval){
		//alert("在清除定时器："+interval);
		window.clearInterval(interval);
	}
}
</script>
<body onload="createInterval()" onunload="createInterval()">
<input type="text" id="isPageBack" value="false" style="width: 500px;display:none;"/>

</body>
<script>

//每分钟刷新一次
setInterval("refresh(true)", 60000);
</script>

[size=medium]
原先尝试用hidden元素来保存页面跳转前写到页面的isPageBack变量，但在safari浏览器，点击后退按钮后hidden元素的值被还原，可使用隐藏的输入框保存isPageBack变量。另外，safari浏览器中，页面后退时不会触发body的onload事件。[/size]