页面带参数跳转到另一个页面，如何取值

最新推荐文章于 2022-11-29 17:10:55 发布

yuan丶晓枫

最新推荐文章于 2022-11-29 17:10:55 发布

阅读量1.5k

点赞数 4

本文链接：https://blog.csdn.net/qq_54223170/article/details/116601025

版权

其实方法有好几种，简单讲两种

地址栏取值

如果通过地址栏带参数过去，那另一个页面取值有些麻烦，
参数如果有中文，取值则会出现乱码，当然也可以解决乱码问题。

跳转页面带参数
<a href="form.html?name=张三&age=18">跳转页面<a/>

form.html取值页面
<script>
	function ff(){
		var params = location.search.substring(1);
		//处理中文乱码
		var ParamsValue = decodeURI(params);
		//以&进行分割
		var paramsArray=ParamsValue.split("&");
		//定义键值对集合
		var mapParam={};
		for(var i=0;i<paramsArray.length;i++){
			var param=paramsArray[i].split("=");
			if(param.length<=1)continue;
			//等于号的左边放key,右边放值
			mapParam[param[0]]=param[1];
		}
		console.log("name:"+mapParam.name);
		console.log("age:"+mapParam.age);
	}
</script>

也可以使用sessionStorage

这种非常简单

<script>
	function ff(){
			//先将值存入sessionStorage中
			sessionStorage.setItem("name","张三");
			sessionStorage.setItem("age",18);
			//指定跳转的页面
			location.href="form.html";
		}
</script>

<button onclick="ff()">将值存入sessionStorage中<button/>

form.html取值

function ff(){
	var name = sessionStorage.getItem("name");
	var age = sessionStorage.getItem("age");
	alert("姓名："+name+",年龄："+age);
}

<button onclick="ff()">从sessionStorage中取值<button/>

index.html页面如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			function ff(){
				//将值存入sessionStorage中
				sessionStorage.setItem("name","张三");
				sessionStorage.setItem("age",18);
				//跳转页面
				location.href="form.html";
			}
		</script>
	</head>
	<body>
		<a href="form.html?name=张三&age=18">跳转页面<a/>
		<button onclick="ff()">将值存入sessionStorage中<button/>
	</body>
</html>

form.html页面如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			function ff(){
				var params = location.search.substring(1);
				var ParamsValue = decodeURI(params);
				//以&进行分割
				var paramsArray=ParamsValue.split("&");
				//定义键值对集合
				var mapParam={};
				for(var i=0;i<paramsArray.length;i++){
					var param=paramsArray[i].split("=");
					if(param.length<=1)continue;
					//等于号的左边放key,右边放值
					mapParam[param[0]]=param[1];
				}
				console.log("name:"+mapParam.name);
				console.log("age:"+mapParam.age);
			}
			function ff1(){
				//从sessionStorage中取值
				var name = sessionStorage.getItem("name");
				var age = sessionStorage.getItem("age");
				alert("姓名："+name+",年龄："+age);
			}
		</script>
	</head>
	<body>
		<button onclick="ff()">地址栏取值<button/>
		<button onclick="ff1()">从sessionStorage中取值<button/>
	</body>
</html>

如果这篇文章对您有所帮助，记得点赞哟，谢谢！

yuan丶晓枫

关注

4
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
页面带参数跳转到另一个页面，如何取值

其实方法有好几种，简单讲两种地址栏取值如果通过地址栏带参数过去，那另一个页面取值有些麻烦，参数如果有中文，取值则会出现乱码，当然也可以解决乱码问题。跳转页面带参数<a href="form.html?name=张三&age=18">跳转页面<a/>form.html取值页面<script> function ff(){ var params = location.search.substring(1); //处理中文乱码 var Pa
复制链接

扫一扫