2017-04-22 66 views
0

在HTML中,我試圖從一個頁面傳遞JavaScript對象變量到另一個頁面,我嘗試了一些方法,例如使用頁面處理程序的內部存儲和設置值,但沒有他們工作。我的代碼如下: 第1頁:從一個HTML頁面傳遞JavaScript對象變量到另一個

<!doctype html> 

<html> 
    <head> 
     <script> 
      function putRangeValue() { 
       pain_value.value = pain_range.value; 
      } 

      var empData; 
      function saveData() { 
       empData = new Object(); 

       empData.name = emp_name.value; 
       empData.contact = emp_telephone.value; 
       empData.address = emp_address.value; 
       empData.dob = emp_dob.value; 
       empData.reason_visit = visit_reason.value; 
       empData.pain_range = pain_range.value; 
       empData.preferred_time = preferred_time.value; 
       empData.preferred_date = preferred_date.value; 


       document.write(empData.name+" "+empData.contact+" "); 
       document.write(empData.address+" "+empData.dob+" "); 
       document.write(empData.reason_visit+" "+empData.pain_range+" "); 
       document.write(empData.preferred_time+" "+empData.preferred_date); 


       var new_window = window.open("page2.html"); 

       /*var new_window = window.open("page2.html"); 
       new_window.emp=empData.value;*/ 

      } 
     </script> 
    </head> 
    <body> 
     <fieldset> 
      <legend> 
       Personal Details: 
      </legend> 
      Name:<br> 
      <input type="text" id="emp_name" value="john"><br> 
      Telephone number:<br> 
      <input type="tel" id="emp_telephone" value="87473257"><br> 
      E-mail address:<br> 
      <input type="text" id="emp_address" value="[email protected]"><br> 
      Date of birth:<br> 
      <input type="date" id="emp_dob" value="24-04-2017"><br> 
     </fieldset> 
     <fieldset> 
      <legend> 
       Appointment Request: 
      </legend> 
      What is the reason for your visit?<br> 
      <input type="text" id="visit_reason" value="sick"><br> 
      Current pain level<br> 
      <input type="range" min="0" max="10" id="pain_range" value="0" onchange="putRangeValue()"> 
      &nbsp; 
      <input type="text" size="1" id="pain_value" value="0"><br> 
      Preffered date:<br> 
      <input type="date" id="preferred_date" value="25-04-2017"><br> 
      Preferred time:<br> 
      <input type="time" id="preferred_time" value="23:03"><br> 
     </fieldset> 
     <br> 
     <button onclick="saveData()">Submit</button> 
    </body> 
</html> 

第2頁:

<!doctype html> 

<html> 
    <head> 
     <title> 

     </title> 
     <script> 
      function displayData() { 
       var emp = window.opener.empData; 

       document.write(emp.name+" "+emp.contact+" "); 
       document.write(emp.address+" "+emp.dob+" "); 
       document.write(emp.reason_visit+" "+emp.pain_range+" "); 
       document.write(emp.preferred_time+" "+emp.preferred_date); 
      } 
     </script> 
    </head> 
    <body> 

     <script> 
      displayData(); 
     </script> 
    </body> 
</html> 

什麼已經提到here我也試過,但我總是得到錯誤

Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame. 
    at displayData (file:///E:/page2.html:13:28) 
    at file:///E:/file:///E:/page2.html:25:4 

即使我沒有使用任何框架。

+0

'file://'網址總是被CORS阻止;而是從localhost測試。 –

+0

所以這段代碼是正確的,但頁面需要在本地主機上運行才能訪問該對象?無論如何,修改本地文件的CORS配置嗎? – Mirhawk

+0

您在嘗試使用哪種瀏覽器? – guest271314

回答

相關問題