搜索
写经验 领红包

网页跳转怎么写(网页的跳转怎么做)

导语:干货:网页跳转的写法大全及其用途区别

网页跳转怎么写(网页的跳转怎么做)

有时候,我们会希望网页自动跳转,应用场景包括:

提交表单后自动转到另外一个页面,页面地址变了,希望访问老地址时能自动转到新地址,等等。

下面总结下如何在前端页面中控制跳转的方法:

利用html的refresh

<meta http-equiv="refresh" content="0;url=index.html"> 

其中0表示0秒以后跳转,可以自行设定时间。

利用js的href属性

window.location.href='index.html';

如果要设定延迟时间,则加上setTimeout

setTimeout("javascript:location.href='index.html'", 5000);

利用js的navigate方式

window.navigate("index.html");

自动刷新页面

在上述方式中,如果跳转的页面就是本页面,那么就是自动刷新页面的功能。

或者使用reload

location.reload()

跳转到上一页,下一页的方式

window.history.go(-1);

其中 -1 表示上一页,如果没有负号的就是表示下一页

如果不是1而是 2,3,4......n 则表示前进或者后退 n 页

后退还可以用

window.history.back();

两者的区别是:

go(-1):返回上一页,原页面表单中的内容会丢失;

back():返回上一页,原页表表单中的内容会保留。

前进则对应的是:

history.forward():

此外,还有一个参数 history.length 记录了页面前进的序号,如果等于0表示第一页

怎么选择

至此,自动跳转页面、刷新页面、前后切换的方法都齐了!方法多了就有了选择恐惧症?

基本原则:

单纯的页面跳转建议就用html的refresh方法,无需js代码,很简洁。

如果比较复杂,涉及js代码的业务功能,再加上跳转功能的,就用js的各种方法。

此外还要考虑页面是否刷新的问题,希望刷新就用go,否则用back/forward

本文内容由快快网络小婷创作整理编辑!