javascript - 我可以获取一个单词，但不能获取另一个单词，这是怎么回事？

Question

我正在制作一个带有编辑按钮的 CMS。当您单击编辑按钮时，它会将 JSON 文件中的所有内容返回到 CMS 端，以便您可以实际进行编辑。然而，当我尝试获取我的 word 时，我只能获取一个，而我的 JSON 中有 2 个 word。

这就是我的 JSON 的样子:

{
  "main_object": {
    "id": "new",
    "getExerciseTitle": "TestToConfirm",
    "language": "nl_NL",
    "application": "lettergrepen",
    "main_object": {
      "title": "TestToConfirm",
      "language": "nl_NL",
      "exercises": [{
          "word": "huishoudelijk",
          "syllables": [
            "huis",
            "houdelijk",
            "",
            ""
          ]
        },
        {
          "word": "Kleedt u zich maar uit.",
          "syllables": [
            "Kleed",
            "u",
            "zich",
            "uit"
          ]
        }
      ]
    },
    "dataType": "json"
  }
}

这就是我尝试循环遍历我的单词的方式，以便我可以获取所有内容。我确实必须注意，我还将获取音节，并且我不完全确定创建 2 个不同的循环来获取数据是否不好。或者建议在 1 个循环中完成这两项工作？

$(document).ready(function() {


  $.getJSON('json_files/jsonData_' + ID + '.json', function(json) {
    // console.log(json);


    var exercisetitle = json.main_object.getExerciseTitle;
    // console.log(exercisetitle);
    $("#getExerciseTitle").val(exercisetitle);

    var exercise = json.main_object.main_object.exercises;


    $.map(exercise, function(exercise, i) {
      var myindex = 1;
      $("#addOpdracht").click();
      $(".exerciseGetWordInput_" + myindex).val(exercise.word)
      myindex++;
    });

  });

});

exerciseGetWordInput_的代码:#addOpdracht 只是一个创建新锻炼 block 的按钮。我认为这与如何循环或我的应用程序失败的可能原因没有太大关系。

function getWordInput(id, cValue) {
  cValue = cValue || '';
  var wInput = $('<input/>', {
    'class': 'exerciseGetWordInput_' + id + ' form-group form-control ExerciseGetWordInput',
    'type': 'text',
    'name': 'question_takeAudio_exerciseWord[' + exerciseAudioInput + ']',
    'placeholder': 'Exercise',
    'id': 'exerciseGetWordInput',
    'required': true
  });
  return wInput;
}

Answer 1

将 var myindex = 1 移出循环

var myindex = 1;
$.map(exercise, function(exercise, i) {
  $("#addOpdracht").click();
  $(".exerciseGetWordInput_" + myindex).val(exercise.word)
  myindex++;
});

或者您也可以避免使用额外的变量，如下所示，并使用 each 代替

$.each(exercise, function(exercise, i) {
  $("#addOpdracht").click();
  $(".exerciseGetWordInput_" + i).val(exercise.word) // starts with 0
});