OK, vamos voltar.
Até agora, falamos sobre como podemos selecionar os elementos com J Querrey e também como
podemos manipulá-los.
Agora, iremos apresentar a grande parte faltante final, que é evento na consulta J.
Então pense em voltar para Vanilla J. S. Quando adicionamos ouvintes de eventos, usamos um método chamado de ouvinte de eventos.
Bem, parece que Jay, onde ele tem uma tonelada de métodos que têm que ver com eventos.
Então eu tenho a seção de evento aberta em Jake, onde ele pode chegar lá, apenas clicando em eventos aqui.
Então, enquanto me deslizo até aqui, você pode ver apenas quantos.
Os métodos do evento de Coria existem chikor, ele vem com uma tonelada deles.
Então, o que eu vou fazer é destacar as três mais importantes as três que você pode usar.
Noventa e nove por cento do tempo, esses três métodos são pressionados e pressionados rapidamente.
E eu disse que esses três você poderia usar 99% do tempo.
Na verdade, é mais como este aqui.
Você pode usar 99% do tempo.
Então, eu vou mostrar-lhe clique e pressione
a tecla primeiro, mas meu objetivo principal é mostrar o quão incrível é o método.
Então vamos começar.
Então Jay equerries método rápido
é como podemos adicionar muito rapidamente e facilmente um ouvinte de cliques a um único elemento ou a uma coleção de elementos.
Então, você pode ver que eu tenho dois exemplos neste caso.
Estou selecionando algo e depois adicionando um ouvinte de clique com um clique.
Então, selecionamos algo com a idéia de enviar, que corremos.
Clique nele e depois passamos uma função de retorno de
chamada e esta função de retorno de chamada será executada quando algo clicando na idéia de enviar.
E porque é uma ID, há apenas uma na página.
Então, quando esse item é clicado, este código é executado.
Se você der uma olhada abaixo, pode ver que
eu estou selecionando todos os botões na página, que pode ser um.
Podem ser 10 botões e eu estou adicionando um ouvinte de clique a todos eles.
Então, sempre que um botão for rápido, ele alertará alguém clicar no botão.
Então, deixe-me demonstrar isso.
Agora eu tenho uma página HTL simples com o Jay que inclui como CDN.
E eu vou adicionar em vamos fazer eventos de consulta Jay e vou adicionar alguns botões.
Então, o primeiro que eu digo não me corrija.
E então o próximo vai dizer seriamente, sim.
E o último irá dizer que este é o seu último aviso.
Então, vamos salvar e abrir isso no navegador e sempre verificar que J carregou.
ESTÁ BEM.
Parece bom.
Então vamos começar fácil aqui, adicionando um ouvinte rápido a este H-1 e só existe um na página.
Então, precisamos selecionar primeiro com sinal de dólar.
Então, um que nos dá o direito H-1, que apenas um e depois corremos.
Não clique nisso e então precisamos passar em uma
função de retorno de chamada que será executada sempre que clicarmos nesse H-1.
Então, o clique das
cenas está usando um ouvinte de eventos e está adicionando um ouvinte de cliques neste H-1 e podemos fazer
uma função anônima que é muito mais comum de ver, mas um pouco mais intimidante para estudantes mais novos ou
podemos escrever uma função nomeada separadamente e depois passa o nome dessa função aqui.
Mas, como eu disse, as funções anônimas são muito mais comuns.
Então, o que queremos fazer é apenas alertar
cada um correto e vou acertar entrar aqui e agora, se eu clicar neste H-1, você verá que eu encerrei H-1 e isso não acontece em nenhum outro elemento.
Acontece por aqui, lembre-se porque meu H-1 vai todo o caminho pela tela para
que CSSA emita se eu quiser mudar o tamanho daquele, mas só acontece quando eu clico no elemento.
Agora, o que eu quero fazer é mostrar como podemos adicionar um ouvinte rápido a uma coleção de elementos.
Então vou selecionar todos os botões aqui.
como nosso retorno de chamada.
Então, um botão de sinal de dólar e, em seguida, adicionamos nosso clique exatamente assim e podemos passar uma função anônima novamente
E isso será
executado sempre que qualquer botão for clicado e nós apenas faremos um botão de alerta, clique nisso e pressione enter.
E agora, se eu clicar em qualquer um desses botões, vamos clicar no botão botão clicar sair.
Então, considere o javascript de vanilla para adicionar um ouvinte de eventos a uma coleção de botões.
Eu teria que selecioná-los todos com o seletor de consulta ou obter elementos por nome de etiqueta e então
eu teria que usar um loop para fazer um loop para todos eles e então eu teria que
adicionar individualmente um ouvinte de eventos que para ser claro está acontecendo Por trás das cenas.
Mas tudo o que tenho a fazer é escrever esta linha e isso vai me fazer uma correspondência
que irá adicionar os ouvintes do evento individualmente, o que torna sua vida realmente fácil em vez de apenas um botão de aprendizado clicado.
E se eu quisesse mudar o estilo, altere a cor de fundo do botão que foi clicado.
Então eu precisaria adicionar um ouvinte de cliques novamente.
Estou apenas na seta para cima e ao invés de alertar.
O que faremos é mudar a
cor do plano de fundo para que seja algo que o fundo do C-s s e nós o mudaremos para ser rosa.
Então, a questão é o que estamos chamando Dotsie CSSA e devolvemos com o javascript da bailada.
Nós usamos isso.
A palavra-chave, isso e aquilo,
refere-se ao elemento que foi clicado no entanto a consulta NJ que não funcionará bem o que precisamos fazer é usar a versão J Querrey disso.
Este é sempre um pouco de uma idéia confusa.
Eu acho que isso ajuda a lembrar que o que
Shakeri faz é que é claro simpatizar sim e isso envolve na consulta Jay e é grande J. UMA. G. Abrace e isso lhe dá algumas propriedades e métodos especiais.
Então, se queremos usar
o ponto CSSA que é um método de consulta J, temos de garantir que o estamos executando em um objeto de consulta J.
Então, simplesmente velho, este é o jato regular da baioneta isso.
Então precisamos envolvê-lo e dizer que esta é a versão de consulta J.
Então vamos testar isso.
Clique em entrar aqui
e agora vamos clicar no botão primeiro, nós temos esse alerta porque nunca nos deshei do primeiro ouvinte de cliques.
E então o fundo muda para rosa e você pode ver que isso acontecerá com cada um que eu clicar.
Também poderíamos fazer algo assim.
Então eu acerco a seta para cima e eu atualizo a página em vez de apenas mudá-los para ser rosa.
Nós também poderíamos fazer um cancelamento desse registro e o adulto da Walcott registrar o texto do botão que foi clicado.
Então, seria algo como você clicou mais e então eu vou fazer uma variável para armazenar esse texto tão
variável que equivale a sinal de dólar deste ponto e para obter esse texto fora de lá, precisamos usar o
método de texto exatamente como esse kaso que logar você clicou em nós, que é o nosso nome de variável e entre.
E agora, se eu clicar em um que você clicou, não clique em você, você clicou.
Este é o seu último aviso.
E você clicou.
Sério, não me chame.
ESTÁ BEM.
Então, é tudo o que eu vou demonstrar.
Clique.
Para resumir, podemos adicionar um ouvinte a um elemento por vez como fizemos pelo H-1.
Ou podemos fazer isso em uma coleção, onde é realmente útil.
E, por último, se queremos referir-nos ao elemento que foi clicado,
precisamos usar o sinal de dólar, esse é o invólucro de J queery o J. UMA. G. versão da baunilha.
sim este