window.open打开新页面,并将本页数据用过url传递到打开的页面;需要两个页面;

页面1

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8 <form action="">
 9     <div id="name1">
10         <h1>哈哈</h1>
11 
12         <h2>嘿嘿嘿</h2>
13 
14         <p>呵呵呵呵呵呵呵呵呵呵</p>
15     </div>
16     <input id="value1" type="text" name="user.value" />
17 </form>
18 <button id="btn">点击</button>
19 <script src = "http://libs.useso.com/js/jquery/1.8.3/jquery.min.js"></script>
20 <script>
21 
22     $("#btn").click(function(){
23         var a = {
24             name : $("#name1").html(),
25             value: $("#name1").val()
26         };
27         var b = JSON.stringify(a)
28         var url ="1_1.html?"+b;
29         window.open(url, 'newwindow', 'height=700, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no')
30     })
31 
32 
33 </script>
34 </body>
35 </html>

页面2

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8 <h1>"hello word"</h1>
 9 <div id="div2">
10 
11 </div>
12 <script src="http://libs.useso.com/js/zepto/1.1.1/zepto.min.js"></script>
13 <script>
14     $(function(){
15         var url1 = location.search;
16         if (url1.indexOf("?") != -1) {
17             var url = url1.substr(1);
18         }
19         var jsondata = decodeURI(url);
20         var data = JSON.parse(jsondata);
21         $("#div2")[0].innerHTML = data.name;
22 
23     })
24 </script>
25 </body>
26 </html>

里面用到了,json的序列化与反序列化;JSON.parse()与JSON.stringify()

还有一种传递数据的方法是通过document.write()直接将数据写入到新打开的页面;预览就是这么做的

坚持下去就能成功
原文地址:https://www.cnblogs.com/suoking/p/4914901.html