HTML 개체 대 jQuery 개체

여기서 일하는 것은 빈 Rails 3.2.8 앱입니다. 여기
은 바로 레이아웃 코드 :

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Editor</title> 
     <%= stylesheet_link_tag "application", :media => "all" %> 
     <%= csrf_meta_tags %> 
    </head> 
    <body> 
     <%= yield %> 
     <%= javascript_include_tag "application" %> 
    </body> 
</html>

잘, 더 간단 할 수 없습니다? 이제 폼보기 :

<%= form_for(@note) do |f| %> 
    <% if @note.errors.any? %> 
    <div id="error_explanation"> 
     <h2><%= pluralize(@note.errors.count, "error") %> prohibited this note from being saved:</h2> 

     <ul> 
     <% @note.errors.full_messages.each do |msg| %> 
     <li><%= msg %></li> 
     <% end %> 
     </ul> 
    </div> 
    <% end %> 

    <div class="field"> 
    <%= f.text_area :body, class: 'tkh-editable' %> 
    </div> 
    <div class="actions"> 
    <%= f.submit %> 
    </div> 
<% end %>

나는 많은 코더는 jQuery를 두 번로드 또는 잘못된 순서에 문제가 있다고보고이 주제를 연구하는 동안.
가 여기 내 application.js에서 비 주석 매니페스트 파일입니다 : 난 그냥이 코드를 넣을 경우 tkh_editor.js.coffee 파일에서

//= require jquery 
//= require jquery_ujs 
//= require tkh_editor/tkh_editor

, 그것은 잘 작동 :

jQuery -> 
    $(".tkh-editable").css("border","solid 5px red")

위의 클래스를 사용하여 텍스트 영역 주위에 테두리를 추가합니다.
플러그인을 만들려고하는데 1 단계에서 멈추었습니다.

다음 코드가 작동하지 않는 이유는 무엇입니까?

Uncaught TypeError: Object # has no method 'css'

도움과 내가 잘못 무엇인지 설명해주십시오 :

jQuery.fn.extend 
    tkhEditor: -> 
    return @each -> 
     this.css("border","solid 5px red") 

jQuery -> 
    $(".tkh-editable").tkhEditor()

크롬 콘솔은 나에게 다음과 같은 오류를 제공합니다.

출처

2012-11-06 allesklar

사실, jQuery 저작 가이드 라인 http://docs.jquery.com/Plugins/Authoring에 따르면 일단 플러그인 코드 안에있는 'this'는 jQuery에 이미 래핑되어야하므로 데이빗 (David)이해야 할 일을 woudn't해야합니다. 그의 대답에서 제안하십시오. 문제는 그것을 코프 스크립트에 반영하는 방법입니다. – WTK

은 페이지로 보내진 결과 소스 코드를 게시해야합니다. – charlietfl

@WTK 래핑되어야하는'.each' 콜백 내부의'this' 컨텍스트입니다. – David

아마도 this을 jQuery로 랩핑하면됩니다. 교체하십시오 :

this.css("border","solid 5px red")

로 : 당신은 each 함수 내에서 this를 호출

$(this).css("border","solid 5px red")

출처

2012-11-06 12:45:09 David

빙고! 고마워. 솔루션을 알면 완전히 이해할 수 있습니다. ;-) – allesklar

JQuery Elements는 기본적으로 .css()와 같은 모든 편리한 함수가 포함 된 래퍼 객체이므로 – Vengarioth

따라서 this이의 jQuery 개체가 아닙니다. 이 시도 : 커피 스크립트 컴파일러는 인생 (즉시 호출 기능 식) 생산

$ = jQuery 
$.fn.extend 
    tkhEditor: -> 
    return @each -> 
     $(this).css("border","solid 5px red")

때문에, 당신은 인수를 수정할 수 없습니다 :

jQuery.fn.extend 
    tkhEditor: -> 
    return @each -> 
     jQuery(this).css("border","solid 5px red")

당신이 jQuery를위한 $을 사용하려는 경우,이 작업을 수행.

출처

2012-11-06 12:49:37 Serabe

Serabe에게 감사드립니다. 데이빗은 너보다 조금 더 빠르므로 나는 그에게 대답 할 것이다. – allesklar

HTML 개체 대 jQuery 개체

답변

관련 문제