1つのhtmlページから別のページにJavaScriptを通して変数を渡す

Question

"ページ1"と "ページ2"という2つのページがあります。 1ページ目には、値が「1」のテキストボックスがあります。 100と最後にボタンがあります。

ボタンを押すと、グローバル変数（？）にテキストボックスの値を保存し、2ページにジャンプします。 "window.onload"を使用して、2番目のJavascript関数で保存された値を警告しますページ1。ここで

は、私のJavascriptのコードは次のとおりです。 "ページ1" で

<script type="text/javascript"> 

var price; //declare outside the function = global variable ? 

function save_price(){ 

    alert("started_1"); //just for information 

    price = document.getElementById('the_id_of_the_textbox').value; 

    alert(price); //just for information   
} 

<script type="text/javascript"> 

function read_price(){ 

    alert("started_2"); 

    alert(price); 

} 

私はこのセンドボタンがあります。

<input class="button_send" id="button_send" type="submit" value="Submit_price" onclick="save_price();"/> 

それが始まりますJavascript関数とredi私を正しく私のページに導きます2。私は常にグローバル変数価格の「未定義」の値を取得

window.onload=read_price(); 

：

しかし、これでは、2ページ目をONT。

私はこれらのグローバル変数についてたくさん読んでいます。例えば。このページ：Problem with global variable..しかし、私はそれを働かせることができません...

これはなぜ機能していませんか？

Answer 1

コードを読まずにシナリオを読まないと、私はlocalStorageを使って解決します。 ここでは例として、prompt()を使用します。Page1の上

：PAGE2オン

window.onload = function() { 
    var getInput = prompt("Hey type something here: "); 
    localStorage.setItem("storageName",getInput); 
} 

：

window.onload = alert(localStorage.getItem("storageName")); 

あなたはまた、クッキーを使用することができますが、localStorageをはるかにスペースを使用できます、そしてあなたがページを要求したとき、彼らはサーバーに戻って送信されません。

Answer 2

ここで最も良いオプションは、クエリ文字列を使用して値を送信することです。

how to get query string value using javascript

• だから、1ページがpage2.htmlにリダイレクト？この場合は 'someValueの'

をsomeValueの= ABC

2ページは、 は、クエリ文字列を読み取ることができ、具体的にキー学習の練習以外のものではありませんが、セキュリティの影響を考慮する必要があります。

グローバル変数は、一度ページが再読み込みされると破棄されるため、ここで役立ちません。

Answer 3

あなたは、いくつかの異なるオプションがあります。

• あなたのページがステートフルですのであなたは、SammyJS、またはAngularjsのようなSPAルータとUI-ルータを使用することができます。
• あなたの状態を保存するためにsessionStorageを使用してください。
• URLハッシュに値を格納します。