Невозможно вызвать событие элемента после добавления элемента

Question

У меня возникла проблема при использовании append() для добавления элемента. После добавления я хочу обработать событие нажатия этого элемента, но это не сработает. Это мой код:

$(...).append("<input class='chat_input'>"); 

$('.chat_input').on('keypress', function(ev){ 
    console.log(ev) }); 

Пожалуйста, помогите мне.

Answer 1

Вам необходимо добавить обработчик события в документ, если вы запустите свой дескриптор нажатия, прежде чем добавить его, он не будет добавлен ни к каким добавленным входам после.

Вот jsFiddle: https://jsfiddle.net/CanvasCode/z8xcytLq/

JQuery

$(function() { 

    $('.input').append("<input class='chat_input'>") 

    $(document).find('.chat_input').on('keypress', function (ev) { 
     console.log(ev) 
    }); 
}); 

Также глобальный обработчик события лучше, так как вы не будете иметь 6 различных обработчиков для 6 различных входов

Answer 2

Я установил его это мой код: $ (document) .delegate ('.chat_input', 'keypress', function (ev) {