实现两个html页面之间通过get方式传值

1. 第一个html页面

<input type="button" id="btn" value="点我进入第二个页面">
<b id="b1"></b>/<b id="b2"></b>
<script src="js/jquery.min.js"></script>
<script>
	$(funcation(){
		//创建变量b1、b2
		var b1;
		var b2;
		//获取url
		var searchParams=new URLSearchParams(window.location.href);
		//判断url中是否有b2这个请求参数名
		if(isNaN(parseInt(searchParams.get("b2")))){
		//没有就赋值为0
			b1=0;
			b2=0;
		}else{
		//有就将请求中值赋给变量
			b1=parseInt(searchParams.get("b1"));
			b2=parseInt(searchParams.get("b2"));
		}
		//在页面中显示变量
		$("#b1").html(b1);
		$("#b2"),html(b2);
		//按钮的单击函数
		$("#btn").click(funcation(){
			//点击一次,b2增加1
			b2++;
			//更新显示
			$("#b2").html(b2);
			//跳转到第二个html页面
			window.location.href="html2.html?b1="+b1+"&b2="+b2;
		});
	});
</script>

2. 第二个html页面

<input type="button" id="btn" value="点我进入第一个页面">
<b id="b1"></b>/<b id="b2"></b>
<script src="js/jquery.min.js"></script>
<script>
	$(funcation(){
		//获取url
		var searchParams=new URLSearchParams(window.location.href);
		//创建并初始化变量
		var b1=parseInt(searchParams.get("b1"));
		var b2=parseInt(searchParams.get("b2"));
		//显示变量
		$("#b1").html(b1);
		$("#b2"),html(b2);
		//按钮单击函数
		$("#btn").click(funcation(){
			//单击一次,b1自增1
			b1++;
			//显示更新
			$("#b1").html(b1);
			//跳转到第一个html页面
			window.location.href="html1.html?b1="+b1+"&b2="+b2;
		});
	});
</script>

3. 反思
以上可以实现类似浏览投票计数的效果(ps:因为有朋友问如果要实现浏览投票效果,但只用html和js怎么实现,于是查到了这种方式),网页之间交互数据的方式非常多,但如果要实现浏览投票计数的话,这种方式不免太过繁琐不便,结合后端实现这样的效果会更加容易些

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值