No passado, usei o vínculo de JQuery diretamente aos eventos. No entanto, naquela época, eu não gerei elementos DOM dinamicamente, mas os elementos DOM que existiam originalmente na página para encadernação de eventos. Recentemente, quando testei o evento de ligação ao DOM gerado dinamicamente, descobri que o evento era inválido, então testei:
1. Causas do fracasso do evento:
(1) A ligação do evento de ligação é válida apenas para elementos presentes no DOM. Ele não pode ser monitorado quanto a elementos que adicionamos dinamicamente mais tarde, para que não possa ser vinculado.
(2) Da mesma forma, quando você usa var aa = document.getElementsByTagName ("elemento gerado dinâmico"); Para obter elementos gerados dinamicamente, porque a página da Web executará apenas a ligação de inicialização uma vez e os elementos DOM gerados dinamicamente não podem ser monitorados depois disso.
2. Solução:
(1) Ligue mais eventos em cada local gerado dinamicamente, como o exemplo deste blog
(2) Mudar o vínculo para o LIVE, porque o LIVE é monitorado em tempo real e também é eficaz para elementos DOM recém -adicionados (porque é constantemente vinculativa e julgamento, pode afetar os problemas de desempenho da Web)
(3) A alteração se liga ao delegado, porque o delegado é monitorado em tempo real.
(4) em JQuery1.7, os métodos Bind (), Live () e Delegate () foram substituídos por ON.
3. Regarding the reasons for the recent event failure: In the original web page (the code can be seen at https://github.com/UFOwl/ife/tree/master/stage02/task16), I want to get the delete button dynamically generated in the table to help delete the delete button bind the delete time, but the delete event is invalid because the delete button is dynamically generated. Ao inicializar a ligação do evento, o botão na tabela obtida já está vazia; portanto, os elementos ligados estão sempre vazios; portanto, não há resposta ao clicar no botão.
4. A solução final: primeiro obtenha a tabela e depois vincule o evento de clique da tabela (porque a tabela está no elemento DOM que já existe) e depois capture o alvo do evento (por exemplo, clique no botão na tabela. Nesse momento, porque o botão foi gerado dinamicamente e anexar -o na tabela, o botão existe. No momento, o alvo refere -se a) e, em seguida.
Nota: Duas questões são observadas aqui:
(1) Os elementos da tabela foram adicionados à tabela; portanto, ao clicar nesse botão, o botão que você obtém é o que você deseja.
(2) Por que os botões foram adicionados à tabela, mas ainda não pode ser obtido? Como os botões da tabela são obtidos quando a função init () é inicializada, mas nenhuma operação foi realizada no momento, então o que é obtido está vazio, portanto, nenhum elemento está ligado.
Os dois problemas que precisam receber atenção acima devem ser claramente distinguidos, e essa é a chave para o problema.
5. Sobre o Bind: Após cada evento de ligação, o evento será vinculado. Descobrir e depois se rebater, caso contrário, o evento sempre existirá. É por isso que, ao trabalhar em um projeto, às vezes o resultado da solicitação do AJAX será sobreposto como 1, 2, 4, 8. Porque se o ligação for usado, cada evento de acionamento estará vinculado a uma operação. Portanto, quando a primeira vez for acionada, a solicitação de Ajax será solicitada uma vez; Quando a segunda vez for acionada, a solicitação AJAX será 1+1 = 2 vezes; A terceira vez é 1+2+1 = 4 vezes; A quarta vez é 1+2+4+1 = 8 vezes, e assim por diante. Portanto, se você usar o Bind para vincular eventos, primeiro desbaste os eventos originais do elemento e depois se vincule aos eventos, para que as solicitações do AJAX não causem várias vezes.
O artigo acima sobre os motivos e soluções para a falha da geração dinâmica do incidente de ligação ao DOM é todo o conteúdo compartilhado pelo editor. Espero que possa lhe dar uma referência e espero que você apoie mais o wulin.com.