래퍼 요소에 이벤트 바인딩하기

내가 쓰고있는 jQuery 플러그인의 일부는 동적으로 생성 된 <div> (컨테이너)에 <div> (내용) 입력을 래핑하는 것을 포함합니다.래퍼 요소에 이벤트 바인딩하기

내 플러그인은 콘텐츠 div를 변경하지 않고 container div에 이벤트 처리기를 추가해야합니다.

이것은 내 문제를 설명하는 가장 간단한 HTML입니다. 선이 코드 주위에 전환 (A)와 (B)를 표시하는 경우 예상 작동하기 때문에 것을

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript"> 
     $(function(){ 
      var container = $('<div class="container">');   
      $('#content').wrap(container);   // (A) 
      container.click(function(e){alert('clicked');}); // (B) 
     }); 
    </script> 
</head> 
<body> 
    <div id="content">the content</div> 
</body> 
</html>

참고 :이를 표시하고 용기를 클릭하면 이벤트가 발생하지 않습니다. 내 플러그인은 다소 복잡하기 때문에 내 플러그인에서이 작업을 수행 할 수 없습니다.

출처

2013-09-04 Wernsey

시도는 :

var container = $('<div class="container">');   
$('#content').wrap(container);   
var wrapper = $('#content').parent(); 
wrapper.click(function(e){alert('clicked');});

랩 함수는 래퍼 요소의 사본, 그것은 같은 개체가 아닙니다합니다. 매뉴얼에서

는 .wrap() 함수는 DOM 구조를 지정하려면 $() 공장 함수에 전달 될 수있는 문자열 또는 개체를 취할 수 있습니다. 이 구조체는 여러 레벨의 깊이로 중첩 될 수 있지만 하나의 내부 요소 만 포함해야합니다. 이 구조체의 복사본은 일치하는 요소 집합의 각 요소에 대해으로 래핑됩니다. 이 메소드는 체인 목적으로 원래 요소 세트를 리턴합니다. 문제가 해결되었는지

출처

2013-09-04 13:47:20

감사합니다. 그것은 효과가 있었다. – Wernsey

쉽게

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript"> 
     $(function(){ 
      var container = $('<div class=" unique_container container">');   
      $('#content').wrap(container);   // (A) 
      // container.click(function(e){alert('clicked');}); // (B) 
     }); 
    </script> 
</head> 
<body> 
    <div id="content">the content</div> 
<script> 
    $("body").delegate(".unique_container", "click", function() { 
     alert('now it is clicked.'); 
    }); 
</script> 
</body> 
</html>

으로 관리 할 수있는 것은 페이지를 좋아하십시오.

http://justprogrammer.com/2013/06/25/jquery-basic-concepts/

여기 누구와도 바꿀 수없는 다이애나 컨테이너 클래스를 추가하십시오.

출처

2013-09-04 13:50:56

문서에 .container 요소가 더 있으면 문제가 발생할 수 있습니다. –

감사합니다. 그러나 @PiotrUchman이 말했듯이 다른 .container 요소와 잘 작동하지 않습니다. 내 프로젝트는 플러그인이므로 할 수 없습니다. – Wernsey

래퍼 요소에 이벤트 바인딩하기

답변

관련 문제