Skip to main content
Aviso removido Chamar atenção por Costamilam
Fim da Recompensa com Woss's answer escolhido por Costamilam
Aviso adicionado Chamar atenção por Costamilam
Recompensa Oferecida vale 200 pontos de reputação por Costamilam
Aviso removido Chamar atenção por Costamilam
Fim da Recompensa com Luiz Felipe's answer escolhido por Costamilam
adicionou 80 caracteres ao conteúdo; tags editadas
Fonte Link
Costamilam
  • 10mil
  • 7
  • 42
  • 105

Pesquisando encontrei Event e CustumEvent, ambas podem ser usadas para criar eventos, e para controlar inscrições, remoções e emissões do evento deve-se usar EventTarget, mas não entendi como funcionam, por exemplo, como eu poderia criar um evento personalizado de clique?

//Cria um evento de clique personalizado
const myClick = new Event('myClick');

//Alguma coisa para guardar as chamadas de "addEventListener"

//Adiciona um ouvinte do evento personalizado aoaos elmentoelmentos
myElement.addEventListener('myClick', event => console.log(event));
myOtherElement.addEventListener('myClick', event => console.log(event));

//Quando houver um clique na tela
window.addEventListener('click', function(event) {
    //Percorre uma lista onde ficaria armazenado os elementos que foram adicionado ouvintes do evento
    for(element of elementList) {
        //Se o elemento for igual ao elemento principal do clique na janela
        if (event.target === element) {
            //Dispara o evento customizado de clique
            element.dispatchEvent(myClick);
        }
    }
});

Estou no caminho certo? Como fazer para guardar as chamadas de addEventListener?

O exemplo é exatamente igual ao evento de clique que já existe, é apenas um exemplo. No momento quero saber apenas como se faz nos navegadores modernos, não estou preocupado com compatibilidade

Pesquisando encontrei Event e CustumEvent, ambas podem ser usadas para criar eventos, e para controlar inscrições, remoções e emissões do evento deve-se usar EventTarget, mas não entendi como funcionam, por exemplo, como eu poderia criar um evento personalizado de clique?

//Cria um evento de clique personalizado
const myClick = new Event('myClick');

//Alguma coisa para guardar as chamadas de "addEventListener"

//Adiciona um ouvinte do evento personalizado ao elmento
myElement.addEventListener('myClick', event => console.log(event));

//Quando houver um clique na tela
window.addEventListener('click', function(event) {
    //Percorre uma lista onde ficaria armazenado os elementos que foram adicionado ouvintes do evento
    for(element of elementList) {
        //Se o elemento for igual ao elemento principal do clique na janela
        if (event.target === element) {
            //Dispara o evento customizado de clique
            element.dispatchEvent(myClick);
        }
    }
});

Estou no caminho certo? Como fazer para guardar as chamadas de addEventListener?

O exemplo é exatamente igual ao evento de clique que já existe, é apenas um exemplo. No momento quero saber apenas como se faz nos navegadores modernos, não estou preocupado com compatibilidade

Pesquisando encontrei Event e CustumEvent, ambas podem ser usadas para criar eventos, e para controlar inscrições, remoções e emissões do evento deve-se usar EventTarget, mas não entendi como funcionam, por exemplo, como eu poderia criar um evento personalizado de clique?

//Cria um evento de clique personalizado
const myClick = new Event('myClick');

//Alguma coisa para guardar as chamadas de "addEventListener"

//Adiciona um ouvinte do evento personalizado aos elmentos
myElement.addEventListener('myClick', event => console.log(event));
myOtherElement.addEventListener('myClick', event => console.log(event));

//Quando houver um clique na tela
window.addEventListener('click', function(event) {
    //Percorre uma lista onde ficaria armazenado os elementos que foram adicionado ouvintes do evento
    for(element of elementList) {
        //Se o elemento for igual ao elemento principal do clique na janela
        if (event.target === element) {
            //Dispara o evento customizado de clique
            element.dispatchEvent(myClick);
        }
    }
});

Estou no caminho certo? Como fazer para guardar as chamadas de addEventListener?

O exemplo é exatamente igual ao evento de clique que já existe, é apenas um exemplo. No momento quero saber apenas como se faz nos navegadores modernos, não estou preocupado com compatibilidade

Aviso adicionado Chamar atenção por Costamilam
Recompensa Oferecida vale 100 pontos de reputação por Costamilam
Aviso removido Chamar atenção por ComunidadeBot
Fim da Recompensa sem resposta vencedora por ComunidadeBot
Tweeted twitter.com/StackOverflowPT/status/1046912879499366402
Aviso adicionado Chamar atenção por Costamilam
Recompensa Oferecida vale 50 pontos de reputação por Costamilam
Fonte Link
Costamilam
  • 10mil
  • 7
  • 42
  • 105

Como criar e usar eventos personalizados

Pesquisando encontrei Event e CustumEvent, ambas podem ser usadas para criar eventos, e para controlar inscrições, remoções e emissões do evento deve-se usar EventTarget, mas não entendi como funcionam, por exemplo, como eu poderia criar um evento personalizado de clique?

//Cria um evento de clique personalizado
const myClick = new Event('myClick');

//Alguma coisa para guardar as chamadas de "addEventListener"

//Adiciona um ouvinte do evento personalizado ao elmento
myElement.addEventListener('myClick', event => console.log(event));

//Quando houver um clique na tela
window.addEventListener('click', function(event) {
    //Percorre uma lista onde ficaria armazenado os elementos que foram adicionado ouvintes do evento
    for(element of elementList) {
        //Se o elemento for igual ao elemento principal do clique na janela
        if (event.target === element) {
            //Dispara o evento customizado de clique
            element.dispatchEvent(myClick);
        }
    }
});

Estou no caminho certo? Como fazer para guardar as chamadas de addEventListener?

O exemplo é exatamente igual ao evento de clique que já existe, é apenas um exemplo. No momento quero saber apenas como se faz nos navegadores modernos, não estou preocupado com compatibilidade