将变量传递到不带查询字符串的新页面

Passing Variables to a new page without query string

本文关键字：查询 字符串 新页面 变量      更新时间：2023-09-26

有没有一种方法可以在不使用查询字符串的情况下，将一个变量从一个有弹出iframe的页面传递到客户端按钮点击上的弹出（iframe）？我的变量太大，无法使用查询字符串？

提出相同问题的另一种方法

有没有一种方法可以在不使用查询字符串的情况下，通过客户端按钮点击将变量从一个页面传递到另一个页面？我的变量太大，无法使用查询字符串？

这是用于IE 8和更高版本的html 5存储将不起作用

如果你的两个页面在同一个域上，你可以使用HTML5 LocalStorage。这是一个JavaScript对象，可以容纳大约5MB左右的字符串

如果需要存储字符串以外的其他数据，可以使用JSON.stringfy（）和JSON.parse（）在数据类型和字符串之间进行转换。

没有HTML5

您可以选择使用cookie并使用JavaScript获取/设置它们，否则有许多LocalStorage polyfill可供选择，它们应该能够在受限环境中工作。

您可以从父窗口调用子窗口上存在的函数，并将数据从父窗口传递到子窗口。

我为这个非常基本的例子道歉，在这个例子中，我们将变量dummy_txt中的任何内容从父窗口传递到子窗口。

父级（Parent.htm）

<html>
<body>
    <input id="btn" type='button' value='Open Window' />
    <script>
        var child_win;
        document.getElementById("btn").onclick = function () {
            child_win = window.open("child.htm");
            dummy_txt = 'blah blah blah blah blah...'
            setTimeout(function () { 
                child_win.document.write(dummy_txt); 
                // Hey, you can do child_win.my_own_function(dummy_txt)
            }, 2000);
        }
    </script>
</body>
</html>

子项（Child.htm）

<html><body></body></html>

这不是最干净的方法，但您也可以通过window.parent 让子iframe调用javascript函数来做类似于Nabil建议的事情

var myValueFromParent = window.parent.SomeFunctionOnParentFrame();

我使用此方法不是将值从父级传递给子级，而是将子级信号传递给父级。

尝试以下操作：

主页

<html>
    <head>
        <title>JS Iframe Test</title>
    </head>
    <body>      
        <iframe id="frame" src="js-test-iframe.htm"></iframe>
        <br /><br />
        <input type="text" id="toInject" /> <button id="send">Send To Iframe</button>        
        <script type="text/javascript"> 
            document.getElementById('frame').onload =  function(){  
                document.getElementById('frame').contentWindow.doSomething("Hi");                    
            }
            var btn = document.getElementById('send');
            btn.addEventListener("click", function(){
                var text = document.getElementById('toInject').value;
            
                document.getElementById('frame').contentWindow.doSomething(text);
                // window.frames[0].doSomething(text); // An alternative
            }, false);                  
        </script>
    </body>
</html>

IFrame页面（js-test IFrame.htm）

<html>
    <head>  
        <script type="text/javascript">
            function doSomething(text)
            {
                document.getElementById('valueHere').innerHTML = text;              
            }
        </script>
    </head>
    <body>
        <div id="valueHere">Default Text</div>
    </body>
</html>



请记住，在操作或向其传递任何变量之前，您需要等待iframe加载。还要注意，只有当您在同一域中寻找页面时，这才有效。

相关文章：