zoukankan      html  css  js  c++  java
  • Jquery 页面间传值(非QuerryString)

        实现原理: 实现方式不是很复杂,父页面A打开一个子页面 A1,并同时写一个带参数的接收数据函数Receive(result),在A1页面进行逻辑操作,然后调用父页面A的Receive(result)函数,将结果传递到父页面。

      使用场景:数据选择,参数计算等在多信息页面同一个页面展示影响页面美观。

    父页面:

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="utf-8" />
            <title>页面间通过JS传值</title>
            <script src="//cdn.bootcss.com/jquery/1.9.0/jquery.js"></script>
            <script type="text/javascript">
                function CC_Click() {
                    window.open("default.html","SelectUser", "scrollbars=yes,width=600,height=400,left=150,top=100,status=yes,resizable=yes");
                }
    
                function GetResultFromDefault(result) {
                    $("#Result").val(result)
                }
            </script>
        </head>
    
        <body>
            <div id="Div_Class">
    
                <button onclick="CC_Click()"> click me </button>
                <input type="text" id="Result" value="Nothing"></input>
            </div>
    
        </body>
    
    </html>

     子页面:

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
            <script src="//cdn.bootcss.com/jquery/1.9.0/jquery.js"></script>
            <script>
                function SendInfo() {
                    var Resu = $("#info").val();
                    if(window.opener == null) {
                        window.close();
                        return;
                    } else {
                        window.opener.GetResultFromDefault(Resu);
                        window.close();
                    }
                }
            </script>
        </head>
    
        <body>
            <div>
                <input type="text" id="info" />
                <button onclick="SendInfo()">Send</button>
            </div>
        </body>
    
    </html>
  • 相关阅读:
    hdu 1863 畅通工程(Kruskal+并查集)
    1.1.2最小生成树(Kruskal和Prim算法)
    1.1.1最短路(Floyd、Dijstra、BellmanFord)
    ACM复习专项
    装饰器和偏函数
    Python函数基础
    (六)面向对象高级编程
    Zabbix漏洞利用 CVE-2016-10134
    Struts-S2-045漏洞利用
    F5 BIG-IP 远程代码执行漏洞环境搭建
  • 原文地址:https://www.cnblogs.com/kim-meng/p/6112612.html
Copyright © 2011-2022 走看看