`
mengqingyu
  • 浏览: 329157 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

Ext.History浏览器自定义前进后退功能

ext 
阅读更多
<!--
	在当前页面中,如果做出了一些页面功能操作,想在页面跳转之后,在点后退,可后退到当前页面某个指定功能状态的情况下,
	可以在做出相对操作时执行addHistory(module)方法来给地址栏添加参数状态记录当前状态,这样可在后退时退到当前状态下
-->
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>Ext3浏览器后退功能</title>
<script type="text/javascript">
	Ext.onReady(function() {
		//初始化history组件   
		Ext.History.init();
		//判断如果当前路蓝旗地址#后有test参数,执行传入的方法
		initHistoryUrl("test", function() {
			//js函数,内部自定义实现
		});

		//特殊情况可覆盖浏览器前进后退按钮,当浏览器被添加标记时,点击后退按钮仅执行此方法   
		/*
		Ext.History.on('change', function(token){
			if(token){
				//相应操作
			}
		});
		Ext.History.back(); ext的后退前进方法
		Ext.History.forward();
		*/
	});

	/**
	 * 页面初始化时,截取地址栏#后的标记来判断是否需要执行相应的方法
	 */
	function initHistoryUrl(module, fn) {
		var url = window.location.href;
		var has = url.indexOf('#');
		if (has != -1) {
			var history = url.substring(has + 1);
			if (history == module) fn();
		}
	}
	
	/**
	 * 在浏览器地址上添加标记
	 */
	function addHistory(module) {
		Ext.History.add(module);
	}
</script>
</head>
<body>
<!-- Ext.History所需的form  begin-->
<form id="history-form" class="x-hidden"><input type="hidden" id="x-history-field" /> <iframe id="x-history-frame"> </iframe></form>
<!-- Ext.History所需的form  end -->
</body>
</html>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics