1
00:00:00,360 --> 00:00:01,270
Bem vindo de volta.

2
00:00:01,290 --> 00:00:07,140
Neste vídeo, abordaremos a última grande parte restante da funcionalidade, que é a criação de

3
00:00:07,140 --> 00:00:08,140
novas para fazer.

4
00:00:08,670 --> 00:00:14,610
Então, por aqui, na versão completa, apenas para tropeçar sua memória do jeito que funciona, posso digitá-lo para

5
00:00:14,610 --> 00:00:16,400
você e, em seguida, pressione enter.

6
00:00:16,410 --> 00:00:17,610
Portanto, não há nenhum botão para clicar.

7
00:00:17,610 --> 00:00:24,240
Acabei de entrar e isso vai me enviar e me tornar um novo para fazer aqui, que posso

8
00:00:24,240 --> 00:00:25,360
verificar ou excluir.

9
00:00:26,190 --> 00:00:27,510
Então vamos começar.

10
00:00:27,510 --> 00:00:33,330
A primeira coisa que precisamos fazer é adicionar um ouvinte à entrada de texto que dispara quando atingimos a tecla enter.

11
00:00:34,350 --> 00:00:36,300
Para fazer isso, temos algumas opções.

12
00:00:36,540 --> 00:00:44,880
Podemos usar a tecla pressionada ou podemos usar em nós precisamos começar selecionando a entrada e em vez de

13
00:00:44,880 --> 00:00:46,530
deixá-la como apenas entrada.

14
00:00:46,530 --> 00:00:50,670
Eu vou ser mais específico e dizer que o tipo de entrada é igual ao texto.

15
00:00:50,790 --> 00:00:58,940
Então, isso afetará todas as entradas ou digitará texto igual a igual e depois adicionará nosso DOT e usarei a tecla

16
00:00:58,940 --> 00:01:04,270
pressionar aqui as chamadas do tipo de entrada pressionar a tecla de texto.

17
00:01:04,290 --> 00:01:11,760
Aqui está a função de retorno de chamada, vamos começar com um registro de alt constante e este log constante será

18
00:01:12,450 --> 00:01:15,520
executado em qualquer tecla, pressione apenas a tecla enter.

19
00:01:15,540 --> 00:01:24,340
Então, apenas para manter pressionado e salvar e voltar para o navegador e atualizar e vamos abrir isso aqui.

20
00:01:24,870 --> 00:01:28,910
E quando eu pressionar a tecla, você percebe que eu recebo uma pressão de tecla.

21
00:01:29,130 --> 00:01:33,160
Então vou acertar outra tecla e isso continua subindo.

22
00:01:33,300 --> 00:01:36,590
Então, nós realmente não queremos fazer nada até que o usuário atinja a chave Enter.

23
00:01:36,980 --> 00:01:44,090
Então, precisamos mudar seu código um pouco no vídeo onde apresentamos o método de imprensa de chave.

24
00:01:44,130 --> 00:01:50,940
objeto pressionar tecla e que corresponde à chave que foi pressionada ou o código de caractere da chave.

25
00:01:50,940 --> 00:01:53,520
Eu também falei sobre qual propriedade no

26
00:01:53,550 --> 00:01:58,830
Então, vamos usar isso aqui e vamos verificar se o código do personagem é 13, que é

27
00:01:58,830 --> 00:02:00,480
o código da tecla enter.

28
00:02:00,570 --> 00:02:07,260
Então, devemos voltar a trabalhar novamente com o objeto do evento, que pode ser chamado qualquer coisa

29
00:02:07,260 --> 00:02:17,280
que desejamos e então vamos executar se o evento que triplicar é igual ao número 13, que é como verificamos a chave de entrada, cada personagem

30
00:02:17,730 --> 00:02:24,870
possui a sua própria O código e a tecla enter são 13, então vamos fazer um registro constante.

31
00:02:25,290 --> 00:02:31,890
Você bateu enter e salvará voltar aqui.

32
00:02:31,920 --> 00:02:34,470
Agora eu estou digitando um monte de chaves que não são inseridas.

33
00:02:34,620 --> 00:02:36,900
E agora vou tocar Enter.

34
00:02:37,000 --> 00:02:39,710
Você pode ver que recebemos chamadas sobre log.

35
00:02:39,780 --> 00:02:41,610
Você atingiu enter.

36
00:02:41,610 --> 00:02:42,040
ESTÁ BEM.

37
00:02:42,240 --> 00:02:48,100
Então, ao invés de simplesmente cancelar o logon quando entramos, digite o que precisamos fazer

38
00:02:48,420 --> 00:02:57,210
é tirar o texto daqui, extrair, faça um novo aliado que depois adicionamos depois disso e então queremos limpar essa entrada para

39
00:02:57,210 --> 00:02:58,700
que o texto desapareça.

40
00:02:58,920 --> 00:03:03,780
Então, começaremos extraindo o valor e esse é bastante simples.

41
00:03:03,780 --> 00:03:06,270
Usaremos o método Val.

42
00:03:06,270 --> 00:03:13,750
Então, queremos o valor da entrada que podemos fazer com um simples voto.

43
00:03:14,310 --> 00:03:15,620
Então, vamos fazer um constable.

44
00:03:15,660 --> 00:03:23,180
registre este Darvell, lembre-se de que isso se refere à entrada que a imprensa de chave ocorreu na atualização.

45
00:03:23,580 --> 00:03:25,090
Digite qualquer coisa que não seja inserida.

46
00:03:25,110 --> 00:03:26,280
Nada acontece.

47
00:03:26,280 --> 00:03:34,990
Agora, se eu clicar em um console que registre o valor como você pode ver, digite talo e acertei.

48
00:03:35,100 --> 00:03:38,820
Então, vamos salvar isso em uma variável.

49
00:03:40,020 --> 00:03:45,910
Vamos chamar para que o texto seja igual à vogal de início.

50
00:03:45,960 --> 00:03:52,440
Então, está pegando texto novo a partir da entrada.

51
00:03:52,440 --> 00:04:02,660
E então o que queremos fazer a seguir é criar um novo aliado e adicionar-lhe bem para fazer isso.

52
00:04:02,670 --> 00:04:08,160
Eu vou apresentar um novo método chamado acrescentar a forma como o append funciona é que

53
00:04:08,160 --> 00:04:10,420
primeiro selecionamos um elemento a ser anexado.

54
00:04:10,440 --> 00:04:13,330
Então, vamos adicionar nossas coisas a fazer.

55
00:04:13,500 --> 00:04:18,000
Então, vamos adicionar nossas dívidas à U. N. na página.

56
00:04:18,000 --> 00:04:22,880
Então, você vai e irá acrescentar aliados a esse bem.

57
00:04:23,190 --> 00:04:29,180
Então, se eu fizer, você irá acrescentar e eu posso dar uma série de h t m l.

58
00:04:29,220 --> 00:04:35,430
Então, se eu adicionar aliado aqui e acabei de codificar algo para começar.

59
00:04:35,460 --> 00:04:44,040
Então, este é um novo aliado que anexamos a esta UL, assim como eu

60
00:04:46,810 --> 00:04:51,900
selecionei a UL e isso realmente seleciona tudo mais.

61
00:04:51,910 --> 00:04:54,500
Nós só temos um e depois ficamos sem canetas.

62
00:04:54,790 --> 00:05:02,030
E isso levará essa corda e adicioná-la ao poço como cada Chimo dentro, se você quiser.

63
00:05:02,410 --> 00:05:07,090
Então, eu vou mostrar que quando entramos aqui, não importa o que escrevemos porque

64
00:05:07,090 --> 00:05:08,350
não estamos usando isso.

65
00:05:08,830 --> 00:05:10,660
Ele acrescenta em um novo aliado.

66
00:05:10,780 --> 00:05:18,370
E toda vez que acertar, entro, fará isso e, se eu inspecionar, você pode ver que é um elemento que

67
00:05:18,370 --> 00:05:22,770
foi adicionado dentro do poço assim como estes são elementos semelhantes.

68
00:05:22,840 --> 00:05:28,420
Então, o que queremos fazer, no entanto, é realmente usar a variável do text.

69
00:05:28,480 --> 00:05:33,150
Tudo o que precisamos fazer é usar o sinal de mais para adicionar essa variável.

70
00:05:33,520 --> 00:05:40,630
fechamento e usaremos um sinal de mais e adicionaremos para fazer o texto e isso acabará com uma

71
00:05:40,780 --> 00:05:47,470
grande string que tem o nosso texto que é o que o usuário digitou na entrada mais

72
00:05:47,470 --> 00:05:57,270
O aliado de abertura e encerramento e nós enviamos isso para você irá refrescar o cachorro e pego Enter e nós recebemos um novo aliado aqui.

73
00:05:57,280 --> 00:06:01,970
Então, teremos duas tags de linha de abertura separadas e tags de

74
00:06:02,470 --> 00:06:03,710
Então, há dois grandes problemas.

75
00:06:03,760 --> 00:06:08,090
Um que queremos esclarecer esta entrada e dois, não temos o período.

76
00:06:08,590 --> 00:06:10,870
Comecemos por limpar a entrada.

77
00:06:10,870 --> 00:06:20,710
Tudo o que precisamos fazer é executar sinal de dólar neste voto e dar-lhe uma seqüência vazia onde ele atua como um setter em vez

78
00:06:20,800 --> 00:06:22,460
de apenas um getter.

79
00:06:22,870 --> 00:06:29,110
E isso agora deve nos dar uma entrada vazia quando eu digito um novo para fazer, cada passo para fazer é adicionado

80
00:06:29,110 --> 00:06:30,120
e isso é apagado.

81
00:06:30,490 --> 00:06:32,990
Em seguida, obtenha o intervalo para mostrar de volta.

82
00:06:33,460 --> 00:06:41,110
Então, tudo o que precisamos fazer lá é dentro de nosso aliado, vamos adicionar em uma pilha de extensão e isso será anexado.

83
00:06:42,250 --> 00:06:49,690
E nós só precisamos nos certificar de que temos o X lá e espaço apenas para que o X tenha um espaço entre

84
00:06:49,690 --> 00:06:51,320
ele e denunciar o texto.

85
00:06:51,520 --> 00:06:57,500
E se salvarmos, agora adicionamos uma nova string com um aliado com uma extensão dentro dela.

86
00:06:57,670 --> 00:07:05,030
Então, alimente o cachorro e acabamos com a extensão e o novo aliado.

87
00:07:05,080 --> 00:07:11,710
No entanto, temos um problema com este código que é quando eu adiciono novo para fazer como feed cat

88
00:07:11,710 --> 00:07:13,660
e eu tento verificar os novos.

89
00:07:13,660 --> 00:07:18,540
Eles realmente não fecham nem excluem os antigos que ainda fazem.

90
00:07:18,670 --> 00:07:21,180
Então o evento ao vivo ainda está disparando.

91
00:07:21,490 --> 00:07:26,920
Este evento de palco ainda dispara, mas as novas tatuagens que criam dinamicamente as que

92
00:07:26,920 --> 00:07:30,040
não estão lá quando a página carrega não funcionam.

93
00:07:30,040 --> 00:07:36,160
Isto é o que eu estava falando quando eu mostrei esse slide e ele disse na maioria dos casos rápido

94
00:07:36,210 --> 00:07:38,190
e no Quake vamos fazer o trabalho.

95
00:07:38,380 --> 00:07:40,500
No entanto, existe uma diferença fundamental.

96
00:07:40,570 --> 00:07:47,800
O Quick só irá adicionar ouvintes para os elementos existentes, irá adicionar ouvintes para todos os elementos futuros potenciais.

97
00:07:48,220 --> 00:07:53,920
E é isso que precisamos fazer aqui é usar porque queremos que esses ouvintes estejam ouvindo em

98
00:07:53,920 --> 00:07:55,310
todos os aliados potenciais.

99
00:07:55,390 --> 00:08:01,060
Então abra o fornecimento que eu estou aqui e vou demonstrar como podemos usar em vez de rápido e não rápido.

100
00:08:01,390 --> 00:08:04,800
Portanto, não é uma questão de apenas trocar para estar em frente.

101
00:08:05,050 --> 00:08:14,130
Então, se eu apenas mudar isso para ser um aliado em clique assim, eu deixo isso assim.

102
00:08:14,200 --> 00:08:18,180
Basicamente, é exatamente a mesma coisa exceto com em vez de rápido.

103
00:08:18,310 --> 00:08:25,780
E se eu voltar e atualizar os trabalhos sobre os elementos originais e se eu adicionar novos, isso não funciona.

104
00:08:25,990 --> 00:08:29,450
Portanto, não se trata apenas de trocar rápido e rápido.

105
00:08:29,710 --> 00:08:33,250
Bem, nós realmente precisamos fazer é mudar nosso código um pouco.

106
00:08:33,250 --> 00:08:40,060
Então eu vou mostrar a você a mudança primeiro e depois vou explicar.

107
00:08:40,150 --> 00:08:44,940
Então, o que eu fiz é que eu escrevi você bem na vírgula rápida.

108
00:08:45,180 --> 00:08:46,010
Por quê.

109
00:08:46,060 --> 00:08:52,630
A razão pela qual eu tive que fazer isso é que só podemos adicionar um ouvinte usando a consulta j nos elementos que existem

110
00:08:52,810 --> 00:08:54,890
quando esse código é executado pela primeira vez.

111
00:08:55,180 --> 00:08:59,190
E quando este código é executado a primeira vez que não temos todos os aliados.

112
00:08:59,200 --> 00:09:04,710
Nós só temos três, então, se adicionarmos um ouvinte rápido aos aliados, ele só irá adicionar esses três.

113
00:09:04,720 --> 00:09:09,590
Então, o que fazemos é adicionar um ouvinte a todo o pai da UL.

114
00:09:09,910 --> 00:09:13,590
Então, sempre que clicarmos sobre isso, você ouvirá esse ouvinte.

115
00:09:13,810 --> 00:09:16,690
Exceto que adicionamos este segundo argumento.

116
00:09:17,140 --> 00:09:24,470
E o que esse código faz é dizer quando um aliado é clicado dentro de um você executará este código.

117
00:09:24,580 --> 00:09:28,670
Então, adicionamos um ouvinte a um elemento que existe quando a página é carregada.

118
00:09:28,900 --> 00:09:33,930
Mas estamos realmente apenas ouvindo as mentiras que são clicadas dentro disso.

119
00:09:34,380 --> 00:09:36,300
Então, deixe-me demonstrar isso agora.

120
00:09:37,000 --> 00:09:40,400
Eu vou atualizar e vamos adicionar alguns novos aqui.

121
00:09:40,930 --> 00:09:44,720
Os antigos ainda funcionam e os novos também podem ser verificados.

122
00:09:45,070 --> 00:09:46,550
Mas a exclusão não funciona.

123
00:09:46,840 --> 00:09:50,250
Então precisamos voltar e fazer a mesma mudança exata.

124
00:09:50,410 --> 00:09:58,450
Então, vamos ouvir um evento que existe quando a página carrega com e depois clique, mas nós só queremos que

125
00:09:58,450 --> 00:10:03,520
esse código seja executado quando um intervalo é clicado dentro de um poço.

126
00:10:04,120 --> 00:10:06,690
E se deixarmos isso, devemos ser bons para ir.

127
00:10:06,700 --> 00:10:08,810
Agora vamos testá-lo.

128
00:10:09,040 --> 00:10:14,890
Podemos excluir os antigos e os novos e também podemos atravessar os dois.

129
00:10:15,730 --> 00:10:18,620
Tudo bem, vamos resumir alguns dos novos materiais aqui.

130
00:10:18,640 --> 00:10:24,850
A primeira coisa é o método de adição que pode levar uma seqüência de HMO e, em seguida,

131
00:10:25,090 --> 00:10:27,110
anexará esses elementos ao que selecionamos.

132
00:10:27,340 --> 00:10:34,940
E a segunda coisa foi usar em vez de rápido e adicionar nesta UL em rápido.

133
00:10:34,960 --> 00:10:41,200
E o segundo argumento que especifica aliados que podem ou não estar na página quando carregou dentro

134
00:10:41,990 --> 00:10:46,300
do poço que definitivamente estava na página quando a página foi carregada.

135
00:10:46,450 --> 00:10:51,850
Então, estamos adicionando ouvintes de eventos aos elementos que existem quando a página é carregada para que possamos explicar

136
00:10:51,850 --> 00:10:53,530
os elementos que ainda não existem.

137
00:10:53,980 --> 00:10:55,800
É por nossa funcionalidade básica.

138
00:10:55,810 --> 00:10:57,810
Temos uma lista completa de tarefas.

139
00:10:57,880 --> 00:11:00,710
O que nos concentraremos no próximo vídeo é o estilo.

140
00:11:00,850 --> 00:11:02,350
E definitivamente temos maneiras de ir para lá.
