2016-12-04 1 views
0

保存入力とDOMでそれを書く - あなたは私のコーディングを見ることができますここで...こんにちは私はVAR入力 にHTML5のページから私の入力を保存すると、別のページに表示したいのJavaScript

を。

<html> 
 
    <head> 
 
     <title>TODO supply a title</title> 
 
     <meta charset="UTF-8"> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    </head> 
 
    <body> 
 
     <form method ="post" action="TestJS.html"> 
 
      <p>Vorname: <input type="text" id="vorname"></p> 
 
      <p><input value="Send" type="submit"></p> 
 
     </form> 
 
    </body> 
 
</html>

  
 
    
 
<html> 
 
    <head> 
 
     <title>Testing of JavaScript - Language</title> 
 
     <meta charset="UTF-8"> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    </head> 
 
    <body> 
 
<script> 
 
     
 
     var input = document.getElementById('vorname').value; 
 
     document.write(input); 
 
     
 
    </script> 
 
     
 
    </body> 
 
</html>

+0

Javascriptが掲載さ値にアクセスすることができません。 getまたはlocalStorage()を使用します。 – Lain

答えて

0

あなただけのフロントJavaScriptを終了してあるページから別のページに値を送信することはできません。それにはバックエンドプログラミング言語が必要です。 JavaScriptではnode.jsがそれを実行できるはずです。

0

あなたは<form>要素でGETからmethod属性を設定することができ、"_blank"formtarget属性を設定します。 <input>要素のname属性にクエリ文字列をTestJS.htmldocumentに新しいwindowに渡すように指定します。 TestJS.html使用String.prototype.slice()location.search解析windowloadイベント、String.prototype.split()

はその後、渡されたクエリ文字列を取得TestJS.htmlにある要素の.innerHTMLを設定します。

<form method="GET" action="TestJS.html" target="_blank"> 
    <p>Vorname: 
     <!-- set `name` attribute at `input` element --> 
     <input type="text" name="text" id="vorname"> 
    </p> 
    <p> 
     <input value="Send" type="submit"> 
    </p> 
    </form> 

TestJS.html

<div id="result"></div> 
    <script> 
    window.onload = function() { 
     // parse query string parameters of `location.search` : `?text=<input>` 
     var props = location.search.slice(1).split("="); 
     document.getElementById("result").innerHTML = props[0] + ":" + props[1]; 
    } 
    </script> 

plnkr http://plnkr.co/edit/Dq3PE4Xhx3pllIHSpwNy?p=preview

関連する問題