Передача переменной через 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.