通过URL在前端页面传参的方法

整个过程实例
在HTML页面a.html中：参数写入URL

function detail(goods_id){window.location.href="http://"+window.location.host+"/SecondDemo/pages/goods_detail.html?goods_id="+goods_id;
}

在HTML页面b.html中：获取URL中的参数

function GetUrlPara(){var url = document.location.toString();//获取当前URLif (url.indexOf("?") != -1) {  //判断URL？后面不为空var arrUrl = url.split("?");//分割？var para = arrUrl[1];//获取参数部分if(para)//判断传入的参数部分不为空{var arr = para.split("=");//分割=var res = arr[1];//获取参数的值return res;}   }return null;
}var goods_id=GetUrlPara();

解析

例如
url为：http://localhost:8080/gtgjmgr/gtgjxserver1/gtdelay/bonus.jsp?ywb_id=1008611
参数为url后面的： ywb_id=1008611

function GetUrlPara(){var url = document.location.toString();//获取当前URLvar arrUrl = url.split("?");//分割？var para = arrUrl[1];//获取参数部分var arr = para.split("=");//分割=var res = arr[1];//获取参数的值return res;}

var r=GetUrlPara();
r中便是 ywb_id的值：1008611

参考：

function parseURL(url){var url = url.split("?")[1];var para = url.split("&");var len = para.length;var res = {};var arr = [];for(var i=0;i<len;i++){arr = para[i].split("=");res[arr[0]] = arr[1];}return res;
}

传送门

function GetUrlPara(){var url = document.location.toString();var arrUrl = url.split("?");var para = arrUrl[1];return para;}

传送门

通过URL在前端页面传参的方法相关推荐

VUE 页面传参、页面跳转
方案一:query参数传递 1.router定义 routes: [{path: '/soft',name: '软件详情',component: PannelContent}, ] 2.页面参数接收 ...
AngularJS中页面传参方法
1.基于ui-router的页面跳转传参 (1) 用ui-router定义路由,比如有两个页面,一个页面(producers.html)放置了多个producers,点击其中一个目标,页面跳转到对应的 ...
angularjs跨页面传参遇到的一些问题
上周写课程选择时间功能时需要将课程ID,星期,节次等参数传递给下一个页面,就查了查angularjs的ui-router跨页面传参,一开始是这样写的: 在app.js下添加 params:{'args ...
微信小程序使用onfire.js（事件订阅和分发JavaScript 库）实现跨页面传参，对onfire的全面了解
开发微信小程序时,页面间数据传送多采用URL方式传参.添加全局变量,对于在本地缓存不大实用(感觉操作缓存,应该性能会有一定的损耗吧).而从新打开的页面回到之前的界面,貌似只有放在本地缓存.添加全局变量 ...
uniapp页面传参使用encodeURIComponent转义特殊符号
答主在uniapp页面跳转传imgUrl(地址为:https://metting.oss-cn-beijing.aliyuncs.com/20210615153312771.9AT5NO.jpg?Ex ...
vue页面传参（多个参数传值）与接参 - 代码篇
index.js路由规则设定: /searchResult/syyName=:syyName 发送页面: //传参页面 this.$router.push({name: 'SearchResult', ...
Strut2页面传参跳转 --Struts2
1.本案例借助struts2框架,完成页面传参.跳转功能 2.代码实现 index.jsp: <form action="helloStruts2.action" metho ...
关于uni-app中app页面传参及跳转的问题
由于是第一次接触这个,很多东西需要摸索,废话不多说直接上重点. 我想实现页面b编写完成保存后跳转回页面a,a页面局部刷新并且控件赋值. 那么这就牵扯到页面传参的问题了,可我在网上翻了各种资料,90%都 ...
微信小程序组件与页面的传参、方法调用（二）
微信小程序组件与页面的传参.方法调用使用小程序组件时经常不会只用到静态页面显示,需要一定的交互.这时候就需要知道这么传参与方法调用的了首先先放官方的文档,介绍的还是比较清楚详细,有能力的同学请直 ...

通过URL在前端页面传参的方法

通过URL在前端页面传参的方法

通过URL在前端页面传参的方法相关推荐

最新文章

热门文章