Как воспроизвести кастомное событие при событии load?

Question

uRoot @uroot

JavaScript

Как воспроизвести кастомное событие при событии load?

Есть много логики при кастомном событии choice с использованием делегирования для тега select, где:

if (event.detail.choice.value === "1") { // запускаем одну функцию }
if (event.detail.choice.value === "2") { // запускаем другую функцию }
if (event.detail.choice.value === "3") { // запускаем третью функцию }

То есть если выбрали один option - выполняем одну функцию, выбрали другой - другую, появляются какие-то блоки, окошки, формы и т.д. Они появляются в результате выполнения этих самых функций из проверки выше. Пользователь сохраняет данные. Данные уходят на сервер. Открывает страницу снова - все эти блоки, окошки, формы и т.д должны быть уже открыты, как будь-то он только что выбрал и отработала функция. Данные в нужные поля приходят - их не учитываем. Нужно только отобразить необходимые блоки, окошки, формы и т.д. Как это сделать?

Выбранным option передаётся в data-attribute их value из проверки выше.

Вопрос задан более трёх лет назад
54 просмотра

Комментировать

Подписаться 1 Простой Комментировать

Пригласить эксперта

Ответы на вопрос 1

7 комментариев

uRoot @uroot Автор вопроса

Таких страниц может быть много

Написано более трёх лет назад
Алексей Юдов @OTCloud

CryNet, если один и тот же домен, то ничего страшного. Данные в LS будут храниться на все страницах одного домена.

Написано более трёх лет назад
uRoot @uroot Автор вопроса

TCloud, та я думаю всё же сымитировать кастомное событие. Правда пока хз так вообще можно в моём случае

Написано более трёх лет назад
historydev @historydev Куратор тега JavaScript

CryNet, вам дали готовое решение,не нужно велосипед писать,берите и юзайте

Написано более трёх лет назад
uRoot @uroot Автор вопроса

Владимир, так а что я буду писать в localStorage?

Написано более трёх лет назад
historydev @historydev Куратор тега JavaScript

CryNet, запоминайте выбранные select.value и вытаскивайте при загрузке страницы,следом если выбор был изменен перезаписывайте.

Написано более трёх лет назад

uRoot @uroot Автор вопроса

Владимир, сделал я всё-таки по своему))

let elements = frstItem.concat(scndItem, lstItem)
  elements.forEach(element => {
    let choices = element.querySelectorAll('.choices__list.choices__list--single .choices__item--selectable')

    choices.forEach(element => {
      let value = element.getAttribute('data-value')
      let choices = element.closest('.choices').querySelector(`.choices__list.choices__list--dropdown .choices__list [data-value="${value}"]`)

      choices.addEventListener("choice", ruleEvent)
     // у кастомного события в этом контексте нет event.detail.choice.value
     // поэтому выше вытягивает его из дата-атрибута, а тут присваиваем
      choices.dispatchEvent(new CustomEvent("choice", {
        detail: {
          choice: {
            value: value
          }
        }
      }))

    })
  })

Написано более трёх лет назад

Ваш ответ на вопрос