동적 요소에 대해 라이브 jQuery 이벤트가 실행되지 않습니다.

Question

이 동적 요소 실행에 바인딩하는 (또는 죽은) 이벤트 중 하나도 존재하지 않는 이유는 무엇입니까?

(function ($) { 
    $.fn.myPlugin = function() { 

    var $filterBox = $("<input type='text'>").live("click", function() { 
     alert("Clicked"); 
    }); 
    this.before($filterBox); // insert into DOM before current element 
    return this; // keep chain 
    }; 
})(jQuery); 

나는 여러 <select> 요소에 myPlugin를 호출하고 있습니다. DOM에 요소를 추가하기 전에 바인딩 한 경우 라이브 플러그인없이 작동 할 것이라고 생각했지만 라이브 이벤트조차도 실행되지 않습니다. 내 요소에 ID가 없기 때문에 그것입니까?

---

편집 : 다음 중 하나가 작동하지 않습니다

var $filterBox = $("<input type='text'>").bind("click", function() { 
     alert("Clicked"); 
}); 

Answer 1

:

(function ($) { 
    $.fn.myPlugin = function() { 
     return this.each(function() { 
      // do stuff 
     }); 
    }; 
})(jQuery); 

Answer 2

live 방법은 선택기이 아닌 분리 된 요소와 함께 작동합니다.
정상 (비 live) click 이벤트를 처리 할 수 ​​있으며 정상적으로 작동합니다. (는 이벤트가 발생할 때 선택기에 대한 대상을 확인 이후) 셀렉터를 작동 .live()

Answer 3

, 당신은 ... 당신은 단지 이러한 경우 .click()를 사용해야 요소에 직접 첨부 할 수 없습니다 :

(function ($) { 
    $.fn.myPlugin = function() { 

    var $filterBox = $("<input type='text'>").click(function() { 
     alert("Clicked"); 
    }); 
    this.before($filterBox); // insert into DOM before current element 
    return this; // keep chain 
    }; 
})(jQuery); 

You can try it out here , 또는 .insertBefore()와 약간 짧은 :

(function ($) { 
    $.fn.myPlugin = function() {  
    $("<input type='text'>").click(function() { 
     alert("Clicked"); 
    }).insertBefore(this); 
    return this; 
    }; 
})(jQuery); 

You can test it here.

Answer 4

왜 그냥 바인딩하지 않습니까? http://jsfiddle.net/9WvpA/

Answer 5

"<input type='text'>"이 유효한 HTML이 아니기 때문에 그럴 수 있습니까? 아직 태그를 닫지 않았습니다. 그러나 jQuery가이를 종료 할 수 없는지 확실하지 않습니다. 서로 대체 전역 변수를 사용하고 this.each(...)와 질문의 각 요소 반복하지 않음으로써 해결