zoukankan      html  css  js  c++  java
  • html页面跳转传递参数

    原文:https://www.cnblogs.com/chensihan/p/6812678.html

    效果如下:

    a页面

    点击跳转按钮后

    在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>

    相关资源下载地址:

    jquery.params.js

    以上demo下载地址

  • 相关阅读:
    SpringBoot打jar包以及打成war包 (springboot2.0)
    学习软件开发的心得
    SQA计划
    继续冲吧
    别跑了,看看脚下有木有money
    springIOC的那些事
    ssm
    scrum 第二次冲刺
    云医院
    团队项目开发总结
  • 原文地址:https://www.cnblogs.com/shihaiming/p/10189155.html
Copyright © 2011-2022 走看看