Wie durch Gegenstände von Wert aus einem Array auf eine Variable in Javascript passieren

Question

ich versuche durch ein Array „fSel.sI“, eine Schleife und auf der Basis der Daten innerhalb, geben sie als Werte (nicht Referenz) auf einer Reihe von Funktionsdeklarationen. Im Augenblick ist das Problem ist, dass mydrag eine Referenz enthält, und als ziehbar wird aufgerufen, verwendet es die letzte Array Positionsdaten. Wenn also Start: Ziehen: Stopp: genannt wird, die Werte sind nicht eindeutig. Hilfe?

makeDraggable : function() {
        // create new draggable
        for (var i = 0; i < fSel.sI.length; i++) {
            mydrag = fSel.sI[i];
            $("#" + mydrag).draggable({
                cancel: [''],
                distance: 5,
                containment: "#fWorkspace",
                handle: mydrag,
                start: function() { dragRegister(mydrag)},
                drag: function() { dragItems(mydrag)},
                stop: function() { dragStop(mydrag)}
            });
        }
    },

Answer 1

Sie sollten Blick in Schließungen .

Versuchen Sie, den folgenden Code:

makeDraggable : function() {
        // create new draggable
        for (var i = 0, l = fSel.sI.length, sI = fSel.sI; i < l; i++) {
                var mydrag = sI[i];
                (function(mydrag) {
                            $("#" + mydrag).draggable({
                                    cancel: [''],
                                    distance: 5,
                                    containment: "#fWorkspace",
                                    handle: mydrag,
                                    start: function() { dragRegister(mydrag); },
                                    drag: function() { dragItems(mydrag); },
                                    stop: function() { dragStop(mydrag); }
                            });
                })(mydrag);
         }
},

Ihr Problem ist mit den start, drag und stop Funktionen. Sie führen nicht sofort; durch die Zeit, die sie tun, mydrag wurde auf einen anderen Wert eingestellt. Durch Wickeln eines selbstausführende Funktion um den Codeblock diese Funktionen enthält, erstellen wir einen Verschluss, wo mydrag ändert sich nicht.

Hinweis: Aus Gründen der Performance, wenn Eigenschaften eines Objekts mehr als einmal zugreifen, ist es am besten, eine Variable zu erstellen, dass Verweise (oder hält) die Eigenschaft. In Ihrer for Schleife habe ich zwei Variablen l und sI erstellt, die fSel.sI.length und fSel.sI speichern (jeweils), so dass JavaScript nicht jedes Mal um die Schleife der sI und length Eigenschaften nachschlagen muß.

Answer 2

Dies ist, weil Ihr einen Verschluss zu schaffen. Versuchen Sie stattdessen

makeDraggable : function() {
        // create new draggable
        for (var i = 0; i < fSel.sI.length; i++) {
                mydrag = fSel.sI[i];
                $("#" + mydrag).draggable({
                        cancel: [''],
                        distance: 5,
                        containment: "#fWorkspace",
                        handle: (function(mydrag){return mydrag;}(mydrag)),
                        start: (function(mydrag){return function() { dragRegister(mydrag)};}(mydrag)),
                        drag: (function(mydrag){return function() { dragItems(mydrag)};}(mydrag)),
                        stop: (function(mydrag){return function() { dragStop(mydrag)};}(mydrag))
                });
        }
    },

Werfen Sie einen Blick auf dieses Video die leistungsstarke und Nützlichkeit von Javascript Schließungen zu verstehen: http://vimeo.com/1967261