[JQUERY] 동적으로 생성 된 항목에 대해 작동하지를 클릭 JQuery와 [중복]

동적으로 생성 된 항목에 대해 작동하지를 클릭 JQuery와 [중복]

해결법

1. ---

   1.이 작업을 수행:

   이 작업을 수행:

    $( '#wrapper' ).on( 'click', 'a', function () { ... });
   

   어디 #wrapper 당신이 동적 링크를 추가하는 정적 요소이다.

   그래서, 당신은 HTML 소스 코드에 하드 코딩 된 래퍼가 :

   <div id="wrapper"></div>
   

   당신은 동적 콘텐츠를 입력합니다. 아이디어는 대신 동적 요소에 직접 핸들러 바인딩의 그 래퍼에 이벤트를 위임하는 것입니다.

   BTW, 나는 Backbone.js를 권장합니다 - 그것은이 과정에 구조를 제공합니다 :

   var YourThing = Backbone.View.extend({
   
       // the static wrapper (the root for event delegation)
       el: $( '#wrapper' ),
   
       // event bindings are defined here 
       events: {
           'click a': 'anchorClicked'
       },
   
       // your DOM event handlers
       anchorClicked: function () {
           // handle click event 
       }
   
   });
   
   new YourThing; // initializing your thing
   

2. ---

   2.출처 :이 게시물에

   출처 :이 게시물에

   당신이 당신의 요소를 동적으로 (자바 스크립트를 사용하여) 만든 경우,이 코드는 작동하지 않습니다. .click, 때문에 () 이미 존재하는 요소에 이벤트를 첨부합니다. 당신이 동적으로 자바 스크립트를 사용하여 요소를 작성, 그것은 작동하지 않습니다.

   이를 위해 동적으로 생성 된 요소에서 작동 다른 기능을 사용해야합니다. 이것은 다른 방법으로 수행 할 수 있습니다 ..

   앞서 우리는 () .live 기능을 가지고

   $('selector').live('click', function()
   {
   //your code
   });
   

   그러나) (.live deprecated.This 다른 기능으로 대체 될 수있다.

   대리자():

   당신은 동적으로 생성 된 HTML 요소를 클릭 () 대리자를 할 수 기능을 사용.

   예:

   $(document).delegate('selector', 'click', function()
   {
    //your code
   });
   

   편집 : 위임 () 메소드는 버전 3.0을 사용합니다. 대신에 () 메서드를 사용합니다.

   의 위에():

   당신은 동적으로 생성 된 HTML 요소를 클릭 () 함수에 수 사용.

   예:

   $(document).on('click', 'selector', function()
   {
   // your code
   });
   

3. ---

   3.같은 시도

   같은 시도

   $("#container").on('click', 'someLinkSelector', function(){ $("#container").html( <new html with new spans> ) });
   

   당신은 기본적으로 동적으로 생성 된 요소를 볼 수 있도록 DOM의 비 동적 부분에서 이벤트를 첨부해야합니다.

4. ---

   4.당신은 존재하는 요소에 클릭 이벤트를 추가해야합니다. 당신은 동적 생성 된 DOM 요소에 이벤트를 추가 할 수 없습니다. 당신은, 당신은 "CSTE 연구진은"을 사용하여 존재하는 요소에 이벤트를 바인딩해야 그들에게 이벤트를 추가하고 싶습니다.

   당신은 존재하는 요소에 클릭 이벤트를 추가해야합니다. 당신은 동적 생성 된 DOM 요소에 이벤트를 추가 할 수 없습니다. 당신은, 당신은 "CSTE 연구진은"을 사용하여 존재하는 요소에 이벤트를 바인딩해야 그들에게 이벤트를 추가하고 싶습니다.

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

   .delegate도 작동합니다.

5. ---

   5.

   $("#container").delegate("span", "click", function (){
       alert(11);
   });
   

6. ---

   6..click를 사용하면 단지 이미 존재하는 요소에 이벤트를 첨부합니다.

   .click를 사용하면 단지 이미 존재하는 요소에 이벤트를 첨부합니다.

   당신은 어떤 모니터 동적으로 생성 된 이벤트의 기능을 사용할 필요가 -이 .live ()이었다 JQuery와 이전 버전에서,하지만이 CSTE 연구진로 대체하고있다 ()

7. ---

   7.나는 며칠 전에이 문제를 직면 - 나를 위해 솔루션은 동적으로 생성 된 링크에 필요한 기능을 결합하는 () .bind 사용하는 것이 었습니다.

   나는 며칠 전에이 문제를 직면 - 나를 위해 솔루션은 동적으로 생성 된 링크에 필요한 기능을 결합하는 () .bind 사용하는 것이 었습니다.

   var catLink = $('<a href="#" id="' + i + '" class="lnkCat">' + category.category + '</a>');
   catLink.bind("click", function(){
    $.categories.getSubCategories(this);
   });
   
   getSubCategories : function(obj) {
    //do something
   }
   

   이게 도움이 되길 바란다.

8. ---

   8.1.7.1의 기능에 새로운 jQuery를 사용하여 -

   1.7.1의 기능에 새로운 jQuery를 사용하여 -

   http://api.jquery.com/on/

from https://stackoverflow.com/questions/9484295/jquery-click-not-working-for-dynamically-created-items by cc-by-sa and MIT license