当前位置:软件学堂 > 资讯首页 > 网络编程 > 编程其他 > JS实现页面跳转的几种方法

JS实现页面跳转的几种方法

2012/11/1 15:24:28作者:佚名来源:网络

移动端

我们在网站设计中常常会用到通过这个页面跳转到另外一个页面,如何来实现这一功能呢,其他实现的方法有很多,今天我们就来学习通过JS实现页面跳转的几种方式,希望对你有所帮助。

方法一、这种方法能够等待3秒,采用倒计时的方式,然后通过JS实现跳转到指定的页面,如果你要等待的时间更长,只需把1000改为2000等等,JS代码如下:

<span id="tiao">3</span><a href="javascript:countDown"></a> 3秒后自动跳转…… <meta http-equiv=refresh content=3;url='http://www.xue51.com/'</ul>

<!--脚本开始--> <script language="javascript" type=""> function countDown(secs){ tiao.innerText=secs; if(--secs>0) setTimeout("countDown("+secs+")",1000); } countDown(3); </script> <!--脚本结束-->

 

运行效果如图所示:

JS实现页面跳转方式一

方法二、这种方法采用按钮式跳转,只需点击按钮就可以跳转到指定的页面,JS代码如下:

<INPUT name="pclog" type="button" value="GO" 
onClick="location.href='http://www.xue51.com/'">

运行效果如图所示:

 JS实现页面跳转方式二

 方法三、这种方法通常用到返回上一页面,采用历史记录的形式返回,JS代码如下:

<a href="javascript:history.go(-1)">返回上一步</a>
<a href="<%=Request.ServerVariables("HTTP_REFERER")%>返回上一步</a>

方法四、这种方法是采用直接跳转的方面,不通过任何提示,直接强制性跳转到指定的页面或网址,JS代码如下:

<script>window.location.href='http://www.xue51.com';</script>

方法五、这一方法是采用弹窗的形式转向到某个网站或网页面面,JS代码如下:

<a href="javascript:" onClick="window.open('http://www.xue51.com/',''
,'height=500,width=611,scrollbars=yes,status=yes')">学无忧</a>

方法六、这一方法是采用选择框的形式跳转,通过选择是否进行跳转,JS代码如下:

<script language="javascript">
<!--
function logout()
{
if (confirm("你确定要注销身份吗?是-选择确定,否-选择取消"))
{
window.location.href="http://www.xue51.com/"
}
}
-->
</script>
 

方法七、下面再列出常用的几种方法(简单代码)

第一种:

<script language="javascript" type="text/javascript">
window.location.href="login.jsp?backurl="+window.location.href;
</script>

第二种:

<script language="javascript">
alert("返回");
window.history.back(-1);
</script>

	

第三种:

<script language="javascript">
window.navigate("top.jsp");
</script>	

第四种:

<script language="JavaScript">
self.location=’top.htm’;
</script>

	
第五种:

<script language="javascript">
alert("非法访问!");
top.location=’xx.jsp’;
</script>

本实例JS实现页面跳转源码下载

标签: JS代码  页面