Question

我正在打开这样的新页面：

var openedwidow = window.open(billhref, '', 'scrollbars=1,height='+Math.min(h, screen.availHeight)+',width='+Math.min(w, screen.availWidth)+',left='+Math.max(0, (screen.availWidth - w)/2)+',top='+Math.max(0, (screen.availHeight - h)/2));

第二个html页面如下所示：

<div class="row contractor_data__item">
  <label for="code">Номер</label>
  <input type="text" name="code" id="code" disabled/>
  <input type="hidden" name="documentId" id="documentId">
  <input type="hidden" name="actId" id="actId">
  <input type="hidden" name="actCode" id="actCode">
</div>

在新窗口的页面上打开我有几个字段要填写。例如，我已填写＆＃34;代码＆＃34;第一页上的字段，需要填写＆＃34;代码＆＃34;页面中的字段已打开。怎么做？

问题的第二部分是我填写了打开的页面上的某些字段，例如documentId，并且需要将其传递到第一页，我已经将其称为关闭，例如，或填写的字段。如何做到这一点？

Answer 1

在HTML5中，您可以使用会话将对象从页面传递到另一个：

//将数据保存到sessionStorage

sessionStorage.setItem('key', 'value');

//从sessionStorage获取保存的数据

var data = sessionStorage.getItem('key');

//从sessionStorage中删除已保存的数据

sessionStorage.removeItem('key')

如需进一步参考，您可以查看here

修改示例代码：的 Page1.html

<!DOCTYPE html> <html> <head> <title>Page1</title> <script type="text/javascript"> sessionStorage.setItem("name","ShishirMax"); var fName = sessionStorage.getItem("name"); console.log(fName); function myFunction(){ window.open("page2.html"); } </script> </head> <body> This is Page 1 </br> <button onclick="myFunction()">SendThis</button> </body> </html>

<强> Page2.html

<!DOCTYPE html> <html> <head> <title>Page 2</title> </head> <body> This is Page 2</br> <input type="text" name="txtName" id="txtName" value=""> <script type="text/javascript"> var fName = sessionStorage.getItem("name"); console.log(fName); document.getElementById("txtName").value = fName; </script> </body> </html>

尝试使用以下代码进行测试。

Answer 2

嗨，如果你想在某个页面中传输数据，你可以在js中使用localStorage我们的sessionStorage

关闭浏览器时sessionStorage清除与localstorage之间的区别只有在您提出时才会清除

请参阅sintax的文档，例如：

你的值是'data'变量，例如

var data;
sessionStorage.setItem('nameyourvar', data);

您可以使用以下网址获取其他页面：

sessionStorage.getItem('nameyourvar')

Answer 3

使用查询字符串。这就是他们的目标。不要＆＃39;忘记将值包装在encodeURIcomponent中，以防它们包含任何特殊字符。

window.open("somewhere.html?firstname="+encodeURIComponent(firstname)+"&lastname="+encodeURIComponent(lastname)+"");

在新窗口中，您可以像查询

一样从查询字符串中获取值

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

var firstname = getParameterByName('firstname'); // "Bob"
var lastname = getParameterByName('lastname'); // "Dole"

功能来自here。

Answer 4

由于其他人提及localstorage，您应该知道所有浏览器都不支持localstorage。如果您对使用类似的东西感兴趣（您应该使用查询字符串），可以查看我写的cross browser database Library。

将您的项目设置为第一页上的数据库

jSQL.load(function(){
    jSQL.createTable("UserData", [{FirstName: "Bob", LastName: "Dole"}]);
    jSQL.persist(); // Save the data internally
});

从第二页获取您的商品

jSQL.load(function(){
    var query = jSQL.query("SELECT * FROM `UserData`").execute();
    var row = query.fetch("ASSOC");
    var firstname = row.FirstName;
    var lastname = row.LastName;
});

Answer 5

您可以使用GET参数。

当您打开第二页时，请将您要传递的所有数据作为GET参数传递到网址中，例如：

var billhref = "whatever.html?code=your_code&parameter2=parameter2_value" ;

var openedwidow = window.open(billhref, '', 'scrollbars=1,height='+Math.min(h, screen.availHeight)+',width='+Math.min(w, screen.availWidth)+',left='+Math.max(0, (screen.availWidth - w)/2)+',top='+Math.max(0, (screen.availHeight - h)/2));

创建一个JS函数来获取第二页上的参数：

function getParams() {

    var params = {},
        pairs = document.URL.split('?')
               .pop()
               .split('&');

    for (var i = 0, p; i < pairs.length; i++) {
           p = pairs[i].split('=');
           params[ p[0] ] =  p[1];
    }     

    return params;
}

然后使用此函数获取这样的url参数：

params = getParams();

for( var i in params ){
    console.log( i + ' : ' + params[i] );
}

这将返回如下输出：

code : your_code
parameter2 : parameter2_value

使用PHP可以帮助您解决更短代码的问题

例如，在PHP中，要获取参数code，您只需编写：

$code = $_GET['code'];

它会为您分配一个名为code的变量，您在网址中传递的值与code参数（在此示例中为your_code）。

如何在html页面之间传递值？

5 个答案: