Передача переменной через JavaScript с одной html-страницы на другую

у меня есть две страницы - "Страница 1" и "страница 2". На странице 1 есть текстовое поле со значением, например, 100 и кнопкой в конце.

нажав кнопку, Я хочу, чтобы javascript сохранил значение текстового поля в глобальном (?) переменной и перейти к странице 2. С окном.onload " я хочу, чтобы вторая Javascript-функция предупреждала значение, сохраненное на странице 1.

вот мой код Javascript:

<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);

}

на "странице 1" у меня есть это отправить-кнопка с:

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

он запускает функцию Javascript и перенаправляет меня правильно на мой page2.

но с этим на второй странице:

window.onload=read_price(); 

Я всегда получаю "неопределенное" значение глобальной переменной цены.

Я много читал об этих глобальных переменных. Е. Г. на этой странице: проблема с глобальной переменной.. но я не могу заставить его работать...

Почему это не работает?

3 ответов


не читая ваш код, но только ваш сценарий, я бы решил, используя localStorage. Вот пример, я буду использовать prompt() для краткости.

на page1:

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

на странице 2:

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

вы также можете использовать куки, но localStorage позволяет гораздо больше пробелов, и они не отправляются обратно на серверы при запросе страниц.


ваш лучший вариант здесь-использовать строку запроса для "отправки" значения.

как получить значение строки запроса с помощью JavaScript

  • Итак, Страница 1 перенаправляется на страницу 2.HTML-код?someValue=ABC
  • Страница 2 может тогда прочитайте строку запроса и, в частности, ключ "someValue"

Если это что-то большее, чем учебное упражнение, вы можете рассмотреть последствия для безопасности этого.

глобальные переменные не помогут вам здесь, так как после перезагрузки страницы они будут уничтожены.


У вас есть несколько различных вариантов:

  • вы можете использовать SPA-маршрутизатор, такой как SammyJS или Angularjs и ui-router, поэтому ваши страницы статичны.
  • используйте sessionStorage для хранения состояния.
  • сохраните значения в хэше URL.