JavaScript:For-Loop传递变量

时间:2015-03-30 14:39:05

标签: javascript loops variables for-loop

我已经暂时解决了一个问题并且无法找到任何解决方案。 虽然我已经阅读了this question and answers on stackoverflow,但我无法弄清楚什么是错的。可能是由于缺乏良好的英语。 所以欢迎德语答案。

但是,我试图将变量传递给for循环之外的另一个函数。 这是我的代码:

"use strict";
// gobal vars
var sort = new Array();

$(document).ready(function(){

// Sortable.js
// Copyright 2013-2015 Lebedev Konstantin <ibnRubaXa@gmail.com>
// http://rubaxa.github.io/Sortable/

    var min = 2,
        max = 5,
        elems = new Array();
    elems[0] = document.getElementById("left");
    elems[1] = document.getElementById("center");
    elems[2] = document.getElementById("right");

    for(var i=0, len=elems.length; i<len; i++) {
        var amnt = elems[i].getElementsByTagName("div").length,
            group = "gewicht";
        if (amnt <= min) {
            group = {name: "gewicht", pull: false, put: true};
        } else if (amnt >= max) {
            group = {name: "gewicht", pull: true, put: false};
        }
        sort[i] = Sortable.create(elems[i], {
            group: group,
            animation: 150,
            ghostClass:"ghost",
            draggable: ".draggable",
            onSort: function(evt) {sortEnd(evt, i, min, max)}
        })
    }
});

function sortEnd(evt, j, min, max) {
    var targ = evt.target,
        amnt = targ.getElementsByTagName("div").length;
    console.log(j);
    amnt = targ.getElementsByTagName("div").length;
    if (amnt <= min) {
        sort[j].option("group", {name: "gewicht", pull: false, put: true});
    } else if (amnt > max) {
        sort[j].option("group", {name: "gewicht", pull: true, put: false});
    } else {
        sort[j].option("group", {name: "gewicht", pull: true, put: true});
    }
}

问题出在onSort: function(evt) {sortEnd(evt, i, min, max)},其中for循环中的变量i将为0,1和2.但是在循环之外,函数console.log()中的sortEnd()它将返回3.

我能理解的解释会很好,我的问题的解决方案会更好,两者都是最好的。

由于

2 个答案:

答案 0 :(得分:1)

根据链接的问题,您需要将操作包装在函数中:

(function(group, i) {
  sort.push(Sortable.create(elems[i], {
    group: group,
    animation: 150,
    ghostClass:"ghost",
    draggable: ".draggable",
    onSort: function(evt) {sortEnd(evt, i, min, max)}
  }))
}(group, i));

否则groupi的每个实例都会引用相同的值。

此外,使用数组时,请使用push而不是直接设置ID。

答案 1 :(得分:0)

问题是您的i变量正在被捕获,然后它的值正在发生变化。对此最好的解决方案是IIFE(立即调用的函数表达式):

for (var i = 0, len = elems.length; i < len; i++) {
  ..
  (function(val) {
    sort[val] = Sortable.create(elems[val], {
        group: group,
        animation: 150,
        ghostClass:"ghost",
        draggable: ".draggable",
        onSort: function(evt) {sortEnd(evt, val, min, max)}
    });
  })(i);
}