本文摘自PHP中文网,作者小云云,侵删。
本文主要介绍了html页面跳转传递参数问题的相关资料,需要的朋友可以参考下,希望能帮助到大家。效果如下:
a页面

点击跳转按钮后

在b页面可以获取到对应的值。
代码如下:
a页面:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <!DOCTYPE html>
<html>
<head lang= "en" >
<meta charset= "UTF-8" >
<script src= "js/jquery-3.0.0.min.js" ></script>
<script src= "js/jquery.params.js" ></script>
<title>a页面</title>
<script>
$( function (){
name = $( "#name" ).text();
age = $( "#age" ).text();
$( "#btn" ).on( "click" , function (){
jump1();
});
});
function jump1(){
url = "b.html?name=" +name+ "&age=" +age;
window.location.href = url;
}
</script>
</head>
<body>
<p id= "name" >tony</p>
<p id= "age" >23</p>
<button id= "btn" >跳转</button>
</body>
</html>
|
将要跳转到的b页面:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <!DOCTYPE html>
<html>
<head lang= "en" >
<meta charset= "UTF-8" >
<script src= "js/jquery-3.0.0.min.js" ></script>
<script src= "js/jquery.params.js" ></script>
<title>b页面</title>
<script>
$( function (){
getData1();
});
function getData1(){
var name = $.query.get( "name" );
var age = $.query.get( "age" );
$( "#name" ).text(name);
$( "#age" ).text(age);
}
</script>
</head>
<body>
<p id= "name" ></p>
<p id= "age" ></p>
</body>
</html>
|
大家学会了吗?赶紧动手自己尝试一下吧。
相关推荐:
比较总结mui页面跳转方式之间的差异
php 不使用js实现页面跳转怎么实现
关于html页面跳转的7篇文章推荐
以上就是关于html页面跳转传递参数问题解答的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
Html怎样对图片实现checkbox方法
Html如何设置标题居中
span是块元素吗?
Html5 header标签是什么意思?Html5 header标签的用法详解(附实例)
Html怎么设置背景
Html里需要兼容验证的浏览器有哪些
Html文件的中文乱码问题与在浏览器中的显示问题
Html如何引入js文件
<iframe>是什么?Html中iframe标签的用法详解
Html表格是?什么
更多相关阅读请进入《Html》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » 关于html页面跳转传递参数问题解答