Jquery Plugin: Получить «этот» объект внутри других функций

Question

Я пытаюсь обрешетке ползунок панорамы в качестве плагина JQuery, и у меня есть следующий код ..

$.fn.panorama = function(settings) { 

    var myPanorama = this; 
    .. 

    this.mousedown(function(e){ 

     //do stuff 
     $(this).css... //this all work 
    } 


    //Call mouseup on document in case user lets go of mouse outside draggable object 
$(document).mouseup(function(){ 
    $(myPanorama).easeDragging(); //works but probably not the way to do it 
     this.easeDragging(); //ideal but refers to wrong object 
}); 

    } 

Мой вопрос, как я см к «этому» объекту внутри вызова $ (document) .mouseup?

Поскольку он считает, что «это» - это сам документ, а не объект, прикрепленный к плагину.

На данный момент я просто делаю переменную, и она работает, но должен быть лучший способ!

спасибо!

Answer 1

На самом деле, как вы достигли его является самый простой способ сделать это - хранение ссылки на это:

var myPanorama = this; 

// ... 

    myPanorama.easeDragging(); 

В качестве альтернативы, вы можете использовать jQuery.proxy(), чтобы установить контекст функции (спасибо @Nick):

$(document).mouseup($.proxy(function(){ 
    this.easeDragging(); 
}, this)); 

другой способ сделать это состоит в использовании ECMAScript 5-е издание .bind() метод, ALTH ух вам нужно добавить это прототип функции для того, чтобы работать в неподдерживаемых браузерах:

// From Prototype.js 
if (!Function.prototype.bind) { // check if native implementation available 
    Function.prototype.bind = function(){ 
    var fn = this, args = Array.prototype.slice.call(arguments), 
     object = args.shift(); 
    return function(){ 
     return fn.apply(object, 
     args.concat(Array.prototype.slice.call(arguments))); 
    }; 
    }; 
} 

Затем вы можете использовать его в коде следующим образом:

$(document).mouseup((function(){ 
    this.easeDragging(); 
}).bind(this)); 

Answer 2

Что вы делаете это просто штраф (и полностью правильный).

Один совет оптимизации, хотя, нет никакой необходимости, чтобы обернуть его снова, так как это уже объект JQuery, вы можете просто сделать это:

myPanorama.easeDragging(); 

Answer 3

не могли бы вы связать с документом, в первую очередь (внутри плагин), а затем выработать, если событие полезно для вас (происходит на вашем элементе или дочернем элементе вашего элемента).

Вы должны использовать пространство имен, если вы привязываетесь к документу, например.

$(document).bind('mouseup.panorama', function() { 
    ... 
}