Передача переменной из js в HTML

@lRedle · Регистрация: 15.03.2023

Студворк — интернет-сервис помощи студентам

Всем привет! Помогите разобраться новичку. Итак. Есть js, который выводит value объекта select на HTML странице №1 в переменную selectedValue.

JavaScript
1
2
3
4
5
var selectedValue;
let select = document.querySelector('#select')
select.addEventListener('change',(e)=>{
  selectedValue = select.options[select.selectedIndex].value;
  })

Как данную переменную selectedValue вывести в любое другое поле (будь то input, тут не принципиально) на другой HTML странице №2. Не могу додуматься, единственное что понял, так это что этот js нужно подключить для HTML №2, а дальше произошел ступор мозговины. Спасибо большое!

krvsa · 04.04.2023, 21:48

Сообщение от lRedle

Как данную переменную selectedValue вывести в любое другое поле (будь то input, тут не принципиально) на другой HTML странице №2.

Как "соотносятся" между собой те страницы 1 и 2?
Это абсолютно не связанные друг с другом страницы?
Или одна открыла другую?

@lRedle · 04.04.2023, 21:54 **[ТС]**

В целом задача такая, на первой странице в select выбирается некое скажем рабочее место, id оно же здесь value записывается в переменную selectedValue, открывается вторая страница, где пользователь выбирает из 4 кнопок кого позвать, скажем "мастера", "слесаря" и т.д, после выбора кого позвать открывается 3 страница, куда и нужно передать эту переменную selectedValue

krvsa · 04.04.2023, 22:07

lRedle, т.е. 1 вызывает 2, а та потом вызывает3?

В этом случае можно воспользоваться несколькими способами
- передать параметрами в УРЛ
- записать в sessionStorage https://doka.guide/js/session-storage/

@Кверт · 04.04.2023, 22:17

А зачем делать отдельные страницы? Это же можно реализовать на одной странице либо модальными окнами, либо в каком то блоке, скрывая и открывая информацию при переходе по этапам выбора при помощи js. На отдельных страницах обычно такое не делают. Вы наверняка на каком то примере основываетесь, посмотрите, как там реализовано, 95%, что все в рамках одной страницы

krvsa · 04.04.2023, 22:45

Сообщение от Кверт

На отдельных страницах обычно такое не делают.

Всяко можно сделать... СПА оно не всегда было.

@klyapa · 04.04.2023, 23:03

JavaScript
1
document.getElementById('select').addEventListener('change', e => window.open(`2.html#${e.target.value}`));

@Кверт · 04.04.2023, 23:11

Ну тогда не забудьте повесить на сайте оповещение о том, что собираете cookie и подтверждение согласия, чтоб на штрафы не нарваться

@gogolik · 05.04.2023, 00:20

Кверт, можно ссылку на норму закона, которая подразумевает штрафы? В РФ, естественно.

@Кверт · 05.04.2023, 10:28

Сообщение от gogolik

можно ссылку на норму закона, которая подразумевает штрафы? В РФ, естественно

Закон о персональных данных, можно, по моему, в политике конфиденциальности прописать об использовании cookies. А вообще закон расплывчатый и все что угодно туда можно прилепить. Речь о том, что автор хочет хранить все сессии и передавать со страницы на страницу, поэтому такой совет и дал, лишним не будет.

krvsa · 05.04.2023, 10:45

Сообщение от Кверт

повесить на сайте оповещение о том, что собираете cookie и подтверждение согласия

Про куки никто еще не говорил...

Для данных в УРЛ и sessionStorage такое разрешение не нужно, поскольку никакой долговременной записи на комп не производится.

@lRedle · 05.04.2023, 10:52 **[ТС]**

Всем спасибо, с помощью sessionStorage всё получилось. Скажите есть ли "подводные камни" при работе с этим свойством, могут ли вылезти какие-то костыли позже?

krvsa · 05.04.2023, 10:53

lRedle, работай не переживай...

@lRedle · 05.04.2023, 10:58 **[ТС]**

krvsa, Спасибо! Вопрос может не по теме и не сюда, но хотя бы сориентируете меня. Как мне эти переменные отправить в телеграм чат ботом. Токен и id чата уже есть, везде смотрю при помощи php собирают данные с формы и отправляют, в php я еще глупее чем в js. Может есть способ не собирая данные с формы, отправить в чат эти переменные? Спасибо!

krvsa · 05.04.2023, 11:05

lRedle, я с ПХП не работаю... И с ТБ "поскольку постольку" - т.ч. не подскажу...

Такое лучше спрашивать уже в разделе ПХП.

@lRedle · 05.04.2023, 11:07 **[ТС]**

krvsa, все равно спасибо большое! Помогли разобраться!

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@lRedle 1 / 1 / 1 Регистрация: 15.03.2023 Сообщений: 110
	04.04.2023, 21:54 [ТС]
	В целом задача такая, на первой странице в select выбирается некое скажем рабочее место, id оно же здесь value записывается в переменную selectedValue, открывается вторая страница, где пользователь выбирает из 4 кнопок кого позвать, скажем "мастера", "слесаря" и т.д, после выбора кого позвать открывается 3 страница, куда и нужно передать эту переменную selectedValue 0

krvsa 3807 / 1645 / 428 Регистрация: 14.03.2022 Сообщений: 4,096
	04.04.2023, 22:07
	Сообщение было отмечено lRedle как решение Решение lRedle, т.е. 1 вызывает 2, а та потом вызывает3? В этом случае можно воспользоваться несколькими способами - передать параметрами в УРЛ - записать в `sessionStorage` https://doka.guide/js/session-storage/ 1

@Кверт 18 / 15 / 3 Регистрация: 04.05.2017 Сообщений: 136
	04.04.2023, 22:17
	А зачем делать отдельные страницы? Это же можно реализовать на одной странице либо модальными окнами, либо в каком то блоке, скрывая и открывая информацию при переходе по этапам выбора при помощи js. На отдельных страницах обычно такое не делают. Вы наверняка на каком то примере основываетесь, посмотрите, как там реализовано, 95%, что все в рамках одной страницы 1

@Кверт 18 / 15 / 3 Регистрация: 04.05.2017 Сообщений: 136
	04.04.2023, 23:11
	Ну тогда не забудьте повесить на сайте оповещение о том, что собираете cookie и подтверждение согласия, чтоб на штрафы не нарваться 1

@gogolik Супер-модератор 3943 / 2047 / 829 Регистрация: 13.03.2010 Сообщений: 6,746
	05.04.2023, 00:20
	Кверт, можно ссылку на норму закона, которая подразумевает штрафы? В РФ, естественно. 1

@lRedle 1 / 1 / 1 Регистрация: 15.03.2023 Сообщений: 110
	05.04.2023, 10:52 [ТС]
	Всем спасибо, с помощью sessionStorage всё получилось. Скажите есть ли "подводные камни" при работе с этим свойством, могут ли вылезти какие-то костыли позже? 0

krvsa 3807 / 1645 / 428 Регистрация: 14.03.2022 Сообщений: 4,096
	05.04.2023, 10:53
	lRedle, работай не переживай... 1

@lRedle 1 / 1 / 1 Регистрация: 15.03.2023 Сообщений: 110
	05.04.2023, 10:58 [ТС]
	krvsa, Спасибо! Вопрос может не по теме и не сюда, но хотя бы сориентируете меня. Как мне эти переменные отправить в телеграм чат ботом. Токен и id чата уже есть, везде смотрю при помощи php собирают данные с формы и отправляют, в php я еще глупее чем в js. Может есть способ не собирая данные с формы, отправить в чат эти переменные? Спасибо! 0

krvsa 3807 / 1645 / 428 Регистрация: 14.03.2022 Сообщений: 4,096
	05.04.2023, 11:05
	lRedle, я с ПХП не работаю... И с ТБ "поскольку постольку" - т.ч. не подскажу... Такое лучше спрашивать уже в разделе ПХП. 1

@lRedle 1 / 1 / 1 Регистрация: 15.03.2023 Сообщений: 110
	05.04.2023, 11:07 [ТС]
	krvsa, все равно спасибо большое! Помогли разобраться! 0

Передача переменной из js в HTML

Решение