jQuery droppable 삭제 된 객체 컨텍스트 얻기

Question

droppable 타겟으로 떨어 뜨린 jQuery 위젯의 컨텍스트를 어떻게 구합니까?

이 코드로 드래그 만들어지는 위젯입니다 :

In the code that makes the images be draggable 

ContentImageHolder.prototype = { 

    options: { 
     contentInfo: null, 
    }, 

    getContentInfo: function(){ 
     return this.options.contentInfo; 
    }, 

    makeContentDraggable: function(){ 

     $(this.element).draggable({ 
      revert: true, 
      scroll: false, 

      start: $.proxy(this, 'dragStart'), 
      stop: $.proxy(this, 'dragStop'), 
     }); 
    }, 

    _init: function() { 
     this.makeContentDraggable(); 
    } 

$.widget("basereality.contentImageHolder", ContentImageHolder); 

그리고 다음이 휴지통 이미지를 받아 들일 수있게 내 코드입니다.

TrashCan.prototype = { 

    trashContent: function (event, ui){ 
     //What do I do here to be able to access the functions of the dropped object 
     //droppedObject.getContentInfo(); 
    }, 

    _init: function() { 
     $(this.element).droppable({ 
      drop: $.proxy(this, 'trashContent'), 
     }); 
    }, 
} 
$.widget.bridge('trashCan', TrashCan); 

내가 개체에 대해 함수를 호출 할 수 있도록 낙하 할에 드래그 된 ContentImageHolder의 컨텍스트를 얻을 수 있습니까?

비슷한 키워드로 된 모든 질문은 모두 ui.draggable을 사용한다고하지만 jQuery 위젯이 아닌 DOM 객체를 참조합니다. jQuery 위젯을 사용할 수 있습니까?

Answer 1

jQuery 위젯 또는 UI 요소가 초기화 된 DOM 객체가있을 때마다 해당 객체를 만들 때 사용한 함수를 통해 위젯 또는 UI 요소의 기능 및 속성에 액세스합니다. 그함으로써

, 난 당신이 .getContentInfo을 (호출 할 경우) 다음과 같이 그것을 할 수 있다는 것을 의미 :

trashContent: function (event, ui){ 
    // Set a property of contentImageHolder 
    $(ui.draggable).contentImageHolder("option", "contentInfo", "something") 

    // Access a method of contentImageHolder 
    $(ui.draggable).contentImageHolder("getContentInfo"); 

    // Do whatever.... 
}, 

참고 : 객체 ContentImageHolder의 유형이에 따라 선언 할 수 있습니다 그것은이 좋아 :

ContentImageHolder = { 

    options: { 
     contentInfo: null, 
    }, 

    getContentInfo: function(){ 
     return this.options.contentInfo; 
    }, 

    makeContentDraggable: function(){ 

     $(this.element).draggable({ 
      revert: true, 
      scroll: false, 

      start: $.proxy(this, 'dragStart'), 
      stop: $.proxy(this, 'dragStop'), 
     }); 
    }, 

    _init: function() { 
     this.makeContentDraggable(); 
    } 
} 

IE는 : 적절하지 않은 경우 프로토 타입을 변경하지 마십시오, 또는 당신은 당신의 기능 어딘가에 그들이 모든 객체에 같은 속하지 않는 가지고 끝낼 수 있었다. http://api.jqueryui.com/jQuery.widget/

희망하는 데 도움이 :

더 많은 정보를 들어, jQuery를 위젯 팩토리 문서를 체크 아웃!

== 편집 == 당신은 삭제됩니다 개체의 유형을 알고하지 않습니다,하지만 당신은 가장 쉬운 방법은 내가 그것을 수행하는 생각할 수있는 일반적인 이름의 함수를 호출하려면 다만 이와 같은 개체의 jQuery를 데이터에 매개 변수를 추가하는 것입니다 :

// Inside ContentImageHolder._init() : 
$(this.element).data("basereality.type", "contentImageHolder") 

이것은 당신이 당신의 드래그 핸들러 내부의 종류를 확인 할 수 있습니다 :

trashContent: function (event, ui){ 
    // Get its type like this: 
    var elemType = $(ui.draggable).data("basereality.type"); 

    // Call the getContentInfo function 
    $(ui.draggable)[elemType]("getContentInfo"); 

    // Do stuff 
}, 

은 그럼 그냥 필요 그 발레 "basereality.type"내의 ue는 jQuery에서의 이니셜 라이저 함수의 이름과 동일합니다.