jQuery 플러그인에서 컬렉션 얻기

Question

기본적으로 텍스트 상자, 일부 단추 및 jQuery로 bbcode 편집기를 만드는 방법을 시도합니다. 여기 내 양식이다

<div class="form-group"> 
    <div class="btn-group btn-group-sm"> 
     <button type="button" class="btn glyphicon bbcode" rel="bold"><b>B</b></button> 
     <button type="button" class="btn glyphicon bbcode" rel="italic"><i>I</i></button> 
    </div> 

</div> 
<div class="form-group"> 
    <textarea class="bbcode" rel="editor" cols="100" rows="12"></textarea> 
</div> 

내 플러그인을 사용하여 호출됩니다

<script> 
    $('document').ready(function() { 
     $('.bbcode').bbcode(); 
    }); 
</script> 

및 플러그인 자체, 난 그냥 순간에 이루어 기초가 텍스트 상자의 데이터를 업데이트하려고 노력하고 때 버튼을 클릭 :

이

(function($) { 
    "use strict"; 

    $.fn.bbcode = function() { 

     this.click(function() { 
      var rel = $(this).attr('rel'); 
      if (rel == 'editor') { 
       return this; 
      } else { 
       alert($(this).attr('rel')); // I can see this pop up so the click event is firing 
       $('.bbcode[rel=editor]').val('test'); 
       return this; 
      } 
     }); 
    } 
} (jQuery)); 

이 내가 텍스트 상자를 선택할 수있는 유일한 방법이 될 것 같다, 난 정말 내가 그렇게 원하는 클래스를 하드 코드 싶지 않아요. 내가 찾고있는 것은 스크립트 태그의 함수 호출에서 컬렉션을 가져 오는 방법이라고 생각합니다.

이것은 바보 같거나 명백한 것보다 더 간과했습니다.

Answer 1

즉치 함수에서 this의 값은 컬렉션을 나타냅니다. 그러나 클릭 핸들러 (누르는 요소를 참조 함) 내부에 this이 숨겨져있어 액세스 할 수 없습니다.

저장할 변수를 만들어 this을 저장하면 그것이 내 컬렉션이됩니다.

(function ($) { 
    "use strict"; 

    $.fn.bbcode = function() { 
     var $editors = this; 
     this.click(function() { 
      var rel = $(this).attr('rel'); 
      if (rel == 'editor') { 
       return this; 
      } else { 
       alert($(this).attr('rel')); // I can see this pop up so the click event is firing 
       $editors.val('test'); 
       return this; 
      } 
     }); 
    } 
}(jQuery));