js 页面跳转并传参

您所在的位置:网站首页 网址传参 js 页面跳转并传参

js 页面跳转并传参

2023-12-11 16:33| 来源: 网络整理| 查看: 265

方法一:window.open()

(说在前面)window.open()跳转页面是打开一个新的窗口,这是与window.location的一个不同点。 使用此方法跳转的新页面获取参数的办法是使用window.opener属性,指向原页面(跳转前)的window对象。最后调用你想用的数据。 页面a跳转至页面b:

页面a 我是跳转前的页面a window.open() var data = ["abcd", "efg", 111]; var id = 100001; function goTo() { window.open("b.html"); } ​ 页面b 我是跳转成功页面! var data=window.opener.data; var id=window.opener.id; $("#showData").text(data); $("#showData").text(id);

这里可能会报这样的错 error 查了一下原因是要有相同的域名,在服务器上运行全改成localhost:就可以了。

方法二:window.location

使用window.location.href=""属性进行跳转,在当前页面直接跳转即可。我们在写这个url的时候要把传递的参数也写上如 window.location.href=“b.html?data=data&id=100001” (? 是连接域名和参数的 ;& 是分隔两个参数的) 在跳转页面接受参数时使用window.location.search会返回url中"?"以及其之后的所有参数。然后再对传递的数据进行操作。 页面a跳转至页面b:

页面a 我是跳转前的页面a window.location.href var data = new Array(); var id = 100001; var num = 123; function goTo() { window.location.href = "b.html?data=" + data + "&id=" + id + "&num=" + num; alert("跳转成功"); } //查看并添加传递的data function getData() { let value = $("#text1").val(); data.push(value); console.log(data); } ​

在b页面,接收一个参数比较简单,接收多个参数可能比较麻烦,要写个循环,这里我规定的是接受的参数都放进map里,map的value我都规定的是数组。 当然也可以全写数组啊什么的,根据自己的需要写。

页面b 我是跳转成功页面! var map=new Map(); var receiveData = decodeURI(window.location.search); //只有一条数据时 // var key=data.substring(data.indexOf("?")+1,data.indexOf("=")); // var value=data.substring(data.indexOf("=")+1); // map.set(key,value); //多条数据时 //在后面加个&是为了方便while循环 receiveData=receiveData.substr(receiveData.indexOf("?")+1)+"&"; //展示获取到的参数 $("#showData").text(receiveData); while(receiveData!=""){ let keyEnd=receiveData.indexOf("="); let valueStart=keyEnd+1; let valueEnd=receiveData.indexOf("&"); //split()方法可以将字符串转为数组 map.set(receiveData.substring(0,keyEnd),receiveData.substring(valueStart,valueEnd).split(",")); //更新数据 receiveData=receiveData.substr(valueEnd+1); } //循环输出map for(let [key,value] of map.entries()){ console.log(key+":"+value); }

a.html b.html



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3