`

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

阅读更多
手机、平板电脑浏览器上页面后退后自动刷新页面
运用场景: 从九宫格导航页面跳转到其它页面后,点出浏览器的后退或设备上的后退键。要能够刷新九宫格页面。
  



测试设备:
   GT-P1000 三星平板电脑(其实为大号手机
   操作系统: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




<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>



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

相关推荐

    个人自制安卓浏览器 .zip

    安卓是由Google公司主导开发的开源移动操作系统,主要应用于智能手机和平板电脑。它基于Linux内核,允许开发者使用Java语言进行应用开发。由于其开放性和广泛的设备支持,安卓吸引了大量开发者和用户,形成了庞大的...

    UC浏览器电脑版怎么用?.docx

    UC浏览器电脑版集成了一项创新的WiFi共享功能,允许用户将电脑的网络连接分享给其他设备,如手机和平板,方便它们在无网络环境下的上网需求。 4. **有道翻译插件**: 内置有道翻译插件是UC浏览器的一大亮点,用户...

    单页面和多页面开发及应用

    后端不再负责模板渲染、输出页面工作,后端API通用化,即同一套后端程序代码,不用修改就可以用于Web界面、手机、平板等多种客户端。 -单页面缺点: -首次加载耗时比较多。 解决办法:可以采用基于HTTP Chunk 的首...

    java无刷新分页

    10. **响应式设计**:考虑到不同设备的屏幕尺寸,分页组件需要具有良好的响应性,以适应手机、平板电脑等不同设备。 以上就是Java实现无刷新分页的关键技术和步骤,通过前后端的协同工作,可以提供流畅的分页浏览...

    防刷新的导航菜单.rar

    8. **响应式设计**:现代网站必须考虑多种设备和屏幕尺寸,因此,导航菜单需要有良好的响应式设计,确保在手机、平板电脑和桌面电脑上都能正常工作。 9. **历史记录管理**:为了让用户能够使用浏览器的前进和后退...

    简单浏览器

    - 可能会有一些额外的功能,如刷新、后退、前进按钮,这些可以通过调用`WebView`的相关方法实现。 7. **优化与性能** - `WebView`可能会消耗大量内存,使用后记得调用`clearCache()`和`clearHistory()`释放资源。...

    简单安卓浏览器开发实验报告.doc

    首先,Android是一个开源的操作系统,主要应用于移动设备,如智能手机和平板电脑。它的开放性和灵活性吸引了众多开发者和制造商,形成了庞大的生态系统。实验中提到的Android是由Google与手机联盟共同研发的,目的是...

    Android代码-网页浏览器源码.zip

    Android是一个基于Linux内核的开源操作系统,主要用于智能手机、平板电脑和智能电视等设备。在Android上开发应用程序,主要使用Java或Kotlin编程语言,配合Android SDK(软件开发工具包)和Android Studio IDE。 在...

    tab标签无刷新导航菜单

    可以使用媒体查询(`@media`)来调整布局和样式的适应性,确保在手机、平板电脑和桌面电脑上都有良好的显示效果。 6. **无障碍性**:考虑到无障碍性(Accessibility),我们需要确保tab导航对屏幕阅读器友好。使用...

    简易Wap浏览器

    WAP是为移动设备如手机和平板电脑优化的一种网络通信标准,它允许用户通过GPRS、3G或4G等无线网络访问互联网内容。这种浏览器的出现是为了满足在资源有限的移动设备上快速、便捷地浏览网页的需求。 WAP浏览器的核心...

    Android源码——网页浏览器源码.7z

    Android是一个基于Linux内核的开源移动操作系统,广泛应用于智能手机和平板电脑。在Android上开发应用,通常需要使用Java或Kotlin编程语言,遵循Android SDK(软件开发工具包)和Android Studio IDE。 压缩包内的...

    一键调出IE10常用菜单栏和前进后退按钮.docx

    而在底部的地址栏,则可以进行输入网址、刷新页面、锁定当前网页等操作。 **步骤二:使用快捷键调出** - **操作方法**:除了鼠标操作外,还可以通过快捷键“Windows + Z”来实现菜单栏的调用。 - **效果展示**:按...

    JavaScript中的document.referrer在各种浏览器测试结果

    5. 使用浏览器的前进/后退按钮,`document.referrer`通常能够正确返回。 6. JavaScript通过`location.href`或`window.open`改变页面,`document.referrer`在IE中可能丢失,但其他浏览器一般可以保持。 7. 服务器端的...

    MyBrowser(简单网页浏览器)Android源码.rar

    Android是一个广泛使用的移动操作系统,由Google领导并开放源代码,用于智能手机、平板电脑和其他设备。这个标签提示我们,这个项目将涉及Android SDK、Android Studio开发环境、以及Android应用程序框架和API的使用...

    安卓Android源码——zirco-browser浏览器源码.zip

    在深入探讨Zirco-Browser浏览器的源码之前,我们首先要理解的是,Android系统是一个基于Linux内核的开源操作系统,主要用于移动设备,如智能手机和平板电脑。Android源码是整个系统的基础,包含了操作系统的核心组件...

    精简版jquery-mobile

    这个框架提供了丰富的组件和交互效果,使得开发者能够快速地创建功能丰富的移动应用程序,无论是在智能手机、平板电脑还是桌面浏览器上都能提供一致的浏览体验。 **精简版 jQuery Mobile** 标题中的“精简版 ...

    单页网页导航

    使用媒体查询(Media Queries)、Flexbox或Grid布局等技术,可以确保导航栏在手机、平板电脑和桌面设备上都能正确显示和操作。 **5. SEO优化** 由于SPA的特性,搜索引擎可能难以爬取和索引页面内容,因为它们通常...

    jqueryMobile例子

    这个框架基于 jQuery,并提供了丰富的组件和交互效果,使得开发者能够轻松创建一致的用户体验,适用于各种智能手机和平板电脑。 在“jQuery Mobile 的简单案例”中,我们可以预期学习到以下几个关键知识点: 1. **...

    制作网页所需的一些小图片素材

    8. 响应式设计:在现代网页设计中,图标需要适应不同设备的屏幕尺寸,从桌面到手机,甚至平板电脑。因此,图标可能需要设计成多种尺寸,以确保在任何设备上都能良好显示。 9. 优化加载速度:尽管小图片可能体积不大...

    jQuery移动开发代码

    jQuery Mobile 是一个专门为移动设备设计的前端框架,它利用 jQuery 的强大功能,为智能手机和平板电脑提供了触控优化的交互界面。本压缩包文件“jquery-mobile”包含了多种jQuery Mobile的实例,旨在帮助开发者深入...

Global site tag (gtag.js) - Google Analytics