45fan.com - 路饭网

搜索: 您的位置主页 > 网络频道 > 阅读资讯:html页面跳转传递参数问题有哪些?

html页面跳转传递参数问题有哪些?

2017-09-04 15:42:33 来源:www.45fan.com 【

html页面跳转传递参数问题有哪些?

效果如下:

a页面

html页面跳转传递参数问题有哪些?

点击跳转按钮后

html页面跳转传递参数问题有哪些?

在b页面可以获取到对应的值。

代码如下:

a页面:

<!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>
  <div id="name">tony</div>
  <div id="age">23</div>
  <button id="btn">跳转</button>
</body>
</html>

将要跳转到的b页面:

<!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>
  <div id="name"></div>
  <div id="age"></div>
</body>
</html>

以上所述是小编给大家介绍的html页面跳转传递参数问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对路饭网站的支持!


本文地址:http://www.45fan.com/a/question/91960.html
Tags: 页面 html 跳转
编辑:路饭网
关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部