有关iframe中前进和后退的简单处理

最新推荐文章于 2024-08-16 17:17:17 发布

hyc0204

最新推荐文章于 2024-08-16 17:17:17 发布

阅读量6.1k

点赞数

文章标签： iframe function javascript go border html

本文链接：https://blog.csdn.net/hyc0204/article/details/6999164

版权

一直对iframe中的前进后退理解的不太深，特意找人学习了下。弄了个小例子，记下来。以便以后方便查查。

HTML代码：

<div>
		<a href="index.html">首页</a>    <span id="mt"></span>
		<a href="javascript:go_back();" style="display:block;" id="back_b">后退</a>
		<a href="javascript:go_for();" style="display:block;" id="go_forward">前进</a>

	</div>
	<iframe name="myif" id="myif" src="" style="width:100%; height:100%; zoom:screen; border:0;"></iframe>

Javascript代码：

<script type="text/javascript">
var fram1 = document.getElementById("myif");
var backBut = document.getElementById("back_b");
var goBut = document.getElementById("go_forward");

function go_back(){	 fram1.contentWindow.history.go(-1);
}
	
function go_for(){
	fram1.contentWindow.history.go(1);
	}
	
function setStatus(){
	var currentPagNum = fram1.contentWindow.history.position;
	var maxPagNum = fram1.contentWindow.history.length;
	if(currentPagNum > 0){
		backBut.style.display = "block";
	}else{
		backBut.style.display = "none";
	}
	if(currentPagNum < maxPagNum -1){
		goBut.style.display = "block";
	}else{
		goBut.style.display = "none";
	}
}

window.onload = function(){
document.getElementById("myif").onpreload  = function(){
setStatus();
}
</script>