Question

我的JSON文件的外观如何：（我是从JSON文件中获取的）

{
"main_object": {
"id": "5",
"getExerciseTitle": "TestFor",
"language": "nl_NL",
"application": "lettergrepen",
"main_object": {
  "title": "TestFor",
  "language": "nl_NL",
  "exercises": [
    {
      "word": "test",
      "syllables": [
        "test01",
        "test02",
        "test03",
        ""
      ]
    },
    {
      "word": "tesst",
      "syllables": [
        "test11",
        "test12",
        "",
        ""
      ]
    }
  ]
},
"dataType": "json"
}
}

我的功能如何：

function prepareCheck() {
$.getJSON('json_files/jsonData_' + ID + '.json', function(json) {
       $(document).on('change', '.syl-input', function() {
           var rowCounter = $(this).parent().parent().parent().parent().attr('id');
           var inputCounter = $(this).attr('id');
           var jsyl = json.main_object.main_object.exercises[rowCounter].syllables[inputCounter];
           var jsylall = json.main_object.main_object.exercises[rowCounter].syllables;
           var valueInput = $(this).val();

       if (valueInput == jsyl) {
        var correctInput = $('<input/>', {
            'class': 'form-control',
            'type': 'text',
            'id': 'button' + CBC++,
            'value': valueInput
        });
        console.log(jsyl);
          $(this).replaceWith(correctInput);
              S.playRight();
              S.addRight();
       } else if ($.inArray(valueInput, jsylall) >= -1) {
            $(this).css({'color':'#e00413'});
            S.playWrong();
            S.addWrong();
         }
    });
 });
 }

我要实现的目标，但不知道如何实现：

我想创建一个循环，该循环将为每个所需的word遍历音节。 word“测试”有3个syllables，在我的前端，它为所需的word显示3个输入字段，应正确填写。但是，我该如何遍历syllables并创建一个，只要填满所需syllables的所有word，它都应该变成绿色按钮。当我正确填写syllables时，所需的syllables应该只会变成绿色按钮。因此，对于我的第一个word，当我成功插入“ test01”，“ test02”，“ test03”时，这3个输入字段应该跳到绿色按钮；对于我的第二个word，它应该将2个输入字段变成正确填写这些按钮时，绿色按钮。但是，只要未正确填写某个word的所有所需输入字段，它们就应保留为输入字段。因此，为了简短起见，我只需要检查...或循环？这将检查是否正确填写了各个单词的所有输入字段，如果是这样的话：将它们更改为绿色按钮，每个按钮仍保持自己的值（输入字段中写的内容）。

图片以澄清：

如何检查各自单词的所有输入字段是否正确填写

我要实现的目标，但不知道如何实现：

0 个答案: