2016-05-25 4 views
0

Если я создаю элемент с классом в jQuery, этот элемент не будет включать в себя присоединенные функции.jQuery - присоединить событие динамически

Например, в приведенном ниже коде в первую очередь я создаю 2 разных элемента в html и in (document.ready). Я назначаю событие изменения этому классу.

Эти два элемента работают правильно. Однако при нажатии кнопки я создаю новый элемент, который имеет тот же класс, но связанное событие не будет работать для этого элемента.

Почему это происходит? и как я могу прикрепить все события к новому элементу?

Заранее спасибо.

Мой код:

<body> 
    <div class="main"> 
     <input class="test" value="2" type="text"> 
     <input class="test" value="3" type="text"> 
     <input class="button" value="Click" type="button"> 
    </div> 
</body> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<script> 
    $(document).ready(function() { 
     $('.test').change(function() { 
      $('.main').append('<p>Test</p>'); 

     }); 
     $('.button').click(function() { 
      $('.main').append('<input class="test" value="x" type="text">'); 

     }); 

    }); 
</script> 
+0

использование '.он()' Есть много DUP PLS поиск, прежде чем отправлять :) – guradio

+0

использовать '$ (документ). on ('. test', 'change', function() {' – guradio

+0

@guradio Спасибо за ваши комментарии. Я не нашел его раньше. – Grcn

ответ

2
$('.button').click(function() {}); 

работают только на элементах, а этот код был выполнен.

$('.button').on('click', function() {}); 

работа всех элементов в документе (даже если она добавляется позже)

Смежные вопросы