Question

道歉，如果我的问题标题不准确，我想不出怎么说出来。

var options = [2,3,4]
// select drop down
var select = document.getElementById("itemSet");

for (var i = 0; i < options.length; i++) {
  var opt = options[i];
  var el = document.createElement("option");

  el.text = opt;
  el.value = opt;
  select.add(el);
}

// define arrays
var arrActivity = ["alien monster", "man in business suit levitating", "fencer", "horse racing", "skier", "snowboarder", "golfer", "surfer", "rowboat", "swimmer"];
var arrFood = ["grapes", "melon", "watermelon", "tangerine", "lemon", "banana", "pineapple", "red apple", "green apple", "pear"];
var arrObjects = ["skull and crossbones", "love letter", "bomb", "hole", "shopping bags", "prayer beads", "gem stone", "hocho", "amphora", "world map"];
var arrLetters = ["letter a", "letter b", "letter c", "letter d", "letter e", "letter f", "letter g", "letter h", "letter i", "letter j"];


// format the array data for output into the textarea
function boom() {

  var e = document.getElementById("itemSet");
  var myCols = e.options[e.selectedIndex].value;
  console.log(myCols);

  var arrNew = [];

  if (document.getElementById("radioActivity").checked) {
    y = arrActivity;
  } else if (document.getElementById("radioFood").checked) {
    y = arrFood;
  } else if (document.getElementById("radioObjects").checked) {
    y = arrObjects;
  } else if (document.getElementById("radioLetters").checked) {
    y = arrLetters;
  }

  for (var i = 0; i < y.length; i += myCols) {
    arrNew.push(
      y.slice(i, i + myCols)
    );
  }

  // set the textarea output
  op = JSON.stringify(arrNew, null, 4);
  document.getElementById('output').value = op;
}

<form onSubmit="return false;">

  <label class="radio-inline">
			<input type="radio" name="myArray" id="radioActivity" value="valActivity"> Activity
		</label>

  <label class="radio-inline">
			<input type="radio" name="myArray" id="radioFood" value="arrFood"> Food
		</label>

  <label class="radio-inline">
			<input type="radio" name="myArray" id="radioObjects" value="arrObjects"> Objects
		</label>

  <label class="radio-inline">
			<input type="radio" name="myArray" id="radioLetters" value="arrLetters"> Letters
		</label>

  <select class="form-control" id="itemSet" name="itemSet"></select>

  <button onClick="boom();"> Check Radio </button>

  <textarea id="output" class="form-control" style="width:95%; height:500px; margin-top:20px;"></textarea>

</form>

当我点击“Check Radio”按钮时，我想使用for for循环将数组重新格式化为块：

        for (var i = 0; i < y.length; i+=myCols) {
            arrNew.push(
                y.slice(i, i+myCols)
            );
        }

如果我提交的表格的选择值为例如2然后将数组重新格式化为：

[
    [
        "alien monster",
        "man in business suit levitating"
    ],
    [
        "fencer",
        "horse racing",
        "skier",
        "snowboarder",
        "golfer",
        "surfer",
        "rowboat",
        "swimmer"
    ]
]

而不是2：

[
    [
        "alien monster",
        "man in business suit levitating"
    ],
    [
        "fencer",
        "horse racing"
    ],
    [
        "skier",
        "snowboarder"
    ],
    [
        "golfer",
        "surfer"
    ],
    [
        "rowboat",
        "swimmer"
    ]
]

此CodePen演示了此问题：https://codepen.io/paperknees/pen/boXjXW

我无法弄清楚我做错了什么。

Answer 1

myCols是一个字符串，因此

y = 0;
myCols = "2"
//first iteration
y += myCols // "2"
//second iteration:
y += myCols // "22"

要解决此问题，请添加一元加运算符：

var myCols =  +e.options[e.selectedIndex].value;

Answer 2

你会在这里得到它 -

while (y.length > 0)
    arrNew.push(y.splice(0, myCols))
console.log(arrNew);

就是这样！

for循环在第一次循环后丢失变量值

2 个答案: