Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Глобальное событие, которое увидят все подписчики? (https://javascript.ru/forum/events/76277-globalnoe-sobytie-kotoroe-uvidyat-vse-podpischiki.html)

RX200 20.12.2018 13:24

Глобальное событие, которое увидят все подписчики?
 
Есть кнопки, которые не являются элементами страницы, а являются объектами ЯваСкрипта, часть из них отображены часть нет, в приложении есть возможность пользователю изменить язык. Надо чтоб при смене языка, все кнопки изменили свой текст.
Условия, ни кто не знает сколько кнопок, и где эти кнопки, они сами появляются в разных меню сами исчезают. То есть кнопка должна как то сама понять что ей надо изменить свой текст.
Через костыли я и сам знаю как это решить, по этому ни какие библиотеки не предлагать, как и сами костыли.
В идеале я хочу повесить на кнопки при создании отслеживатель события Х. а при смене языка генерировать событие Х, которое по замыслу увидит каждая кнопка. Как это реализовать?

Nexus 20.12.2018 13:52

Не проще наоборот сделать?
Т.е. не событие вызывается на каждой кнопке, а каждая кнопка самостоятельно слушает событие на документе. Останется только в нужный момент вызвать событие на документе.

SuperZen 20.12.2018 13:52

https://developer.mozilla.org/en-US/...nt/CustomEvent

RX200 20.12.2018 13:56

Цитата:

Сообщение от Nexus
Не проще наоборот сделать?

Просще о чем я и написал.
Цитата:

Сообщение от RX200
В идеале я хочу повесить на кнопки при создании отслеживатель события Х


Nexus 20.12.2018 14:07

Можно сделать как-то так (я в js не особо умею)
class Button {
    getDOMInstance() {
        if (!!this.DOMInstance)
            return this.DOMInstance;

        this.DOMInstance = document.createElement('button');
        this.__setListeners();

        return this.DOMInstance;
    }

    renred() {
        document.body.appendChild(
            this.getDOMInstance()
        );
    }

    __setListeners() {
        document.addEventListener('some-event', this.__someEventListener);
    }

    __someEventListener(e) {
        alert(`${e.type} was triggered`);
    }

    __removeListners() {
        document.removeEventListener('some-event', this.__someEventListener);
    }
}

class LanguageSwitcher {
    __onChange() {
        document.dispatchEvent(new CustomEvent('some-event'))
    }
}

RX200 20.12.2018 14:11

Цитата:

Сообщение от SuperZen
https://developer.mozilla.org/en-US/...nt/CustomEvent

Не работает. откуда взять в примере по ссылке obj? Когда мы вешаем слушатель это делаем внутри объекта и он нам известен, но как потом вызвать его?

RX200 20.12.2018 14:22

Nexus,
Да ваш пример сработал Спасибо)
//Вешаем в каждой кнопке.
this.__someEventListener = function(event){alert("12");};
document.addEventListener('my_Event', this.__someEventListener);
//Потом вызываем где угодно.
document.dispatchEvent(new CustomEvent('my_Event'));

SuperZen 20.12.2018 14:29

<div id="app"></div>
<script>
  let app = document.getElementById('app')

  let button = document.createElement('button')
  button.type = 'button'
  button.innerText = 'Кнопка'
  button.addEventListener('click', function () {
    var event = new CustomEvent("i18n", {
      detail: {
        label: 'Button'
      }
    });
    button.dispatchEvent(event)
  })

  button.addEventListener('i18n', function (e) {
    button.innerHTML = e.detail.label
  })
  app.appendChild(button)
</script>

RX200 20.12.2018 14:41

SuperZen,
У вас в коде как я понял объект известен, button.dispatchEvent(event) там где его вызывают button.addEventListener('click'
По этому не годится. В примере выше, который привел Nexus мы используем, document. вызываем и отслеживаем событие на документе, что полностью соответствует условию, где неизвестно ни кому что за кнопки и в каких объектах, но кнопка узнает что событие произошло, так как событие висит не на самой кнопки и на документе. Хотя дополнительные проблемы с удалением кнопки есть, нужно вызывать __removeListners() не достаточно, просто, на неё удалить все ссылки и отдать сборщику мусора.

SuperZen 20.12.2018 14:46

нет


Часовой пояс GMT +3, время: 12:47.