实现页面跳转的方法

在 HTML 中实现页面跳转

  1. 按钮式(JS 实现原理):

    <input name="##" type="button" value="##" οnclick="location.href='链接'">
    
  2. 链接式 —— 返回上一步:

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

    ASP ServerVariables 集合用于检索服务器变量值,Request.ServerVariables()传入参数为HTTP_REFERER时,返回一个字符串,其中包含使用<a>标签将请求引用到当前页面的 URL,如果页面被重定向,则HTTP_REFERER为空。

在 JS 中实现页面跳转

  1. 当前页链接式跳转:

    // window.navigate()方法是针对IE的,不适用于其他浏览器
    window.navigate("url...");
    // location 属性是兼容所有浏览器的
    // windwow 指 window 对象
    window.location.href="login.jsp?backurl="+window.location.href;
    // self 指当前窗口
    self.location.href="本地url";
    // top 指代主体窗口,一般用于防止外部引用
    if (top.location.href != self.location.href) {
      window.location.href = "url";
    }
    
  2. 返回前一页:

    window.history.back();
    window.history.go(-1);
    // -1 表示要跳转的页面相对于当前页的记录为前一个
    
  3. 打开新窗口:

    window.open('url','','height=500,width=500');
    
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在 Vue.js 中,可以使用 Vue Router 来实现页面跳转。以下是使用 Vue Router 实现页面跳转的基本步骤: 1. 安装 Vue Router: ```bash npm install vue-router ``` 2. 在 `main.js` 中引入 Vue Router 并注册: ```javascript import Vue from 'vue' import VueRouter from 'vue-router' import App from './App.vue' import router from './router' Vue.use(VueRouter) new Vue({ router, render: h => h(App) }).$mount('#app') ``` 3. 创建路由配置文件 `router.js`,并定义路由: ```javascript import VueRouter from 'vue-router' import Home from './components/Home.vue' import About from './components/About.vue' const routes = [ { path: '/', component: Home }, { path: '/about', component: About } ] const router = new VueRouter({ routes }) export default router ``` 4. 在组件中使用 `<router-link>` 标签实现跳转: ```html <template> <div> <router-link to="/">Home</router-link> <router-link to="/about">About</router-link> </div> </template> ``` `<router-link>` 标签会渲染成一个 `<a>` 标签,并自动添加 `href` 属性和事件监听。点击 `<router-link>` 标签会触发路由跳转。 5. 在组件中使用 `$router.push()` 方法实现编程式跳转: ```javascript this.$router.push('/about') ``` `$router.push()` 方法会将路由跳转到指定的路径。可以在组件中使用该方法实现编程式跳转。 以上就是使用 Vue Router 实现页面跳转的基本步骤。根据具体的业务需求,还可以设置路由参数、路由嵌套等高级功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值