JavaScript实现页面跳转的常见方式汇总
作者:闭包旅人时间:2026-10-30 06:38:24浏览:487
本文汇总了JavaScript实现页面跳转的多种常用方式,包括按钮点击跳转、链接返回、直接脚本跳转、新窗口打开以及带确认弹窗的跳转。详细解析了location.href、window.open、history.back等核心API的使用场景与代码示例,帮助开发者根据实际需求选择最佳实践。
JavaScript页面跳转概述
在开发网站时,页面跳转是常见需求。跳转行为可能涉及在当前窗口打开、新窗口打开、根据参数动态跳转或需用户确认后执行等多种场景。本文将介绍几种常用的JavaScript实现页面跳转的方法及示例。
推荐:JavaScript实现页面跳转的多种方式及最佳实践
常见页面跳转方式
方法一:通过按钮触发跳转
<INPUT name="pclog" type="button" value="GO" onClick="location.href='http://www.ddhbb.com/'"> 方法二:通过链接实现跳转
<a href="javascript:history.go(-1)">返回上一步</a>
<a href="<%=Request.ServerVariables("HTTP_REFERER")%>">返回上一步</a>方法三:直接脚本跳转
<script>window.location.href='http://www.ddhbb.com';</script> 方法四:在新窗口中打开页面
<a href="javascript:" onClick="window.open('http://www.ddhbb.com/blog /guestbook.asp','','height=500,width=611,scrollbars=yes,status=yes')"& gt;布丁 足迹
</a> 直接跳转的多种实现
方式一:使用location.href属性
<script language="javascript" type="text/javascript">
window.location.href="login.jsp?backurl="+window.location.href;
</script>方式二:使用history.back()方法
<script language="javascript">alert("返回");window.history.back(-1);
</script>方式三:使用window.navigate()方法
<script language="javascript">window.navigate("top.jsp"); </script>方式四:修改self.location属性
<script language="JavaScript">
self.location='top.htm';
</script>方式五:通过top.location强制跳转
<script language="javascript">
alert("非法访问!");
top.location='xx.jsp';
</script> 带确认弹窗的跳转
JavaScript中通过弹出选择框实现跳转
<script language="javascript">
<!--
function logout()...{
if (confirm("你确定要注销身份吗?是-选择确定,否-选择取消"))...{
window.location.href="logout.asp?act=logout"
}
}
-->
</script>
=====javascript中弹出提示框跳转到其他页面=====
<script language="javascript">
<!--
function logout()...{
alert("你确定要注销身份吗?");
window.location.href="logout.asp?act=logout"
}
-->
</script>以上介绍了JavaScript实现页面跳转的多种常见方式,供参考使用。
作者最新文章
什么时候该用JS构造器:与工厂模式、字面量的选择对比
2026-11-05 16:18:22
推荐几款轻量级JS照片墙开源库及对比
2026-11-05 15:56:19
JavaScript递归写法有哪些常见陷阱及避免方法
2026-11-05 14:53:38
JS数组浅拷贝与深拷贝怎么选?场景与方法总结
2026-11-05 14:41:02
p5.js 中 setup() 和 draw() 函数的执行机制详解
2026-11-05 12:32:38
