How to make a function reference with the 'this' keyword
<p>I'm creating a small tooltip application and I'm having trouble. I'm trying to add an event to the document, but am having trouble referencing the function that needs to be executed. Here is the code:</p>

<pre><code>var Note, note;
(function () {
    'use strict';

    // Helper functions
    function addEvent(to, type, fn) {
        if (to.addEventListener) {
            to.addEventListener(type, fn, false);
        } else if (to.attachEvent) {
            to.attachEvent('on' + type, fn);
        } else {
            to['on' + type] = fn;
        }
    }

    // Temporary constructor
    function Temp() {
        this.dragging = false;

        return this;
    }

    Temp.prototype = {
        listen: function () {
            this.dragging = true;
        },
        drag: function () {
            alert('hi 1');
            if (!this.dragging) return;
            alert('hi 2');
        },
        create: function () {
            // unimportant code ...

            addEvent(document, 'mousedown', this.drag);

            // unimportant code ...
        }
    };

    window.Note = Temp;
}());

note = new Note();
note.create(); // the note is created as planned
note.listen(); // alert(note.dragging) yields true
</code></pre>

<p>If there are small mistakes in the code I don't think those are the problem, the code on my system passes JSLint (I know that doesn't guarantee correctness). Neither of the alerts alert their arguments; I suspect, though, that the problem is assigning 'this.drag' as the function reference to the event handler. Are there any workarounds for this?</p>

<p>Thank you all for your time!</p>
