我已经暂时解决了一个问题并且无法找到任何解决方案。 虽然我已经阅读了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.
我能理解的解释会很好,我的问题的解决方案会更好,两者都是最好的。
由于
答案 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));
否则group
和i
的每个实例都会引用相同的值。
此外,使用数组时,请使用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);
}