[JQUERY] 동적으로 생성 된 요소에 의해 트리거 이벤트는 이벤트 핸들러에 의해 캡처되지 않습니다

동적으로 생성 된 요소에 의해 트리거 이벤트는 이벤트 핸들러에 의해 캡처되지 않습니다

해결법

1. ---

   1.( "이벤트 위임 이해"도 참조) 당신은 페이지 내에서 가장 가까운 정적 조상 요소에 이벤트를 위임 할 필요가있다. 이 단순히 수단, 당신 바인드 이벤트 핸들러가 이미 거품까지 이벤트를 허용해야합니다 그래서 동적으로 생성 된 요소들에 대해 핸들러가 바인딩되는 시점에 존재하고 추가로 최대를 처리해야하는 요소입니다.

   ( "이벤트 위임 이해"도 참조) 당신은 페이지 내에서 가장 가까운 정적 조상 요소에 이벤트를 위임 할 필요가있다. 이 단순히 수단, 당신 바인드 이벤트 핸들러가 이미 거품까지 이벤트를 허용해야합니다 그래서 동적으로 생성 된 요소들에 대해 핸들러가 바인딩되는 시점에 존재하고 추가로 최대를 처리해야하는 요소입니다.

   방법 CSTE 연구진은 JQuery와이 할 수있는 방법입니다 (jQuery를 이전 버전 또는 .delegate합니다.)

   // If version 1.7 or above
   
   $('#modal').on('keyup', 'input', function() {
       handler = $(this).val();
       name = $(this).attr('name');
   });
   

   또는 이전 버전에서

   // If version 1.6 or below
   
   // note the selector and event are in a different order than above
   $('#modal').delegate('input', 'keyup', function()
   {
       handler = $(this).val();
       name = $(this).attr('name');
   });
   

2. ---

   2.당신이 이벤트를 유선 후 입력 요소를 추가하고 있기 때문에이 일어나고있다. 입어보세요:

   당신이 이벤트를 유선 후 입력 요소를 추가하고 있기 때문에이 일어나고있다. 입어보세요:

   $('body').on('keyup', 'input', function() {
       handler = $(this).val();
       name = $(this).attr('name');
   });
   

   CSTE 연구진를 사용하면 원래 페이지에 입력에 확인 KeyUp 이벤트가 연결되어 만들뿐만 아니라 것입니다 나중에 동적으로 추가되는 모든.

3. ---

   3.동적으로 DOM을 변경하는 경우, jQuery를 그들에게 이벤트 핸들러를 첨부하지 않습니다. 당신은에 사용할 필요가 ()와 이벤트를 위임

   동적으로 DOM을 변경하는 경우, jQuery를 그들에게 이벤트 핸들러를 첨부하지 않습니다. 당신은에 사용할 필요가 ()와 이벤트를 위임

   당신의 입력 항목의 경우, 당신이 뭔가를 같이해야합니다 :

   $("<parentSelector>").on("keyup", "input", function() { 
       handler = $(this).val();
       name = $(this).attr('name');
   })
   

   parentSelector는 입력 요소보다 DOM, 페이지로드, 어쩌면 양식 ID 또는 무언가에 존재하는 요소에 뭔가 이상이다.

4. ---

   4.기능 귀속 페이지로드에서 만들어집니다. 라이브 기능을 사용하여 동적으로 생성 된 요소에서 작동하도록 (). 예:

   기능 귀속 페이지로드에서 만들어집니다. 라이브 기능을 사용하여 동적으로 생성 된 요소에서 작동하도록 (). 예:

   $ ("p"). live ("click", function () {
       // Your function
   });
   

5. ---

   5.양식의 모든 요소는, 특히 상자를 선택 당신이 캡처 변경해야하는 경우, 나는 그들이 여기에 언급되지 않은 알고 있지만, 다음과 같은 코드를 사용, 알고 도움이 될 것입니다 :

   양식의 모든 요소는, 특히 상자를 선택 당신이 캡처 변경해야하는 경우, 나는 그들이 여기에 언급되지 않은 알고 있지만, 다음과 같은 코드를 사용, 알고 도움이 될 것입니다 :

   $(document).on('change', ':input', function () {
      alert('value of ' + $(this).attr('name') + ' changed')
   });
   

   이것은 모든 입력, 텍스트 영역, 선택, 체크 박스, 라디오 등을 포함해야한다

from https://stackoverflow.com/questions/12829963/events-triggered-by-dynamically-generated-element-are-not-captured-by-event-hand by cc-by-sa and MIT license