javascript - 为什么我的音节被取回，但我的单词却没有被取回？

Question

所以，我能够以正确的方式获取我的音节，但不知何故我无法获取我的单词，但问题是:我正在获取我的单词与我处理音节的方式完全相同。

function getExerciseBlock(i, data) {
    var eBlock = $('<div/>',{
    'id': i,
    'class': 'col-md-6 eBlock well'
    });

    data = data || {
        word: '',
        syllables: ['','','','']
    };

    $(eBlock).append(
        getRemoveBtnExercise(i),
        getAudioBtn(i),
        getWordInput(i, data.word),
        getWordPartInput(i, data.syllables[0]),
        getWordPartInput(i, data.syllables[1]),
        getWordPartInput(i, data.syllables[2]),
        getWordPartInput(i, data.syllables[3])
    );
    return eBlock;
}

将其取回的“循环”:

// Below this comment starts the fetching data back, so the moderator can change data
$(document).ready(function () {
    $.getJSON('json_files/jsonData_' + ID + '.json', function(json) {

    // Loops through the words and fetches them back to the CMS side.
    var exercise = json.main_object.main_object.exercises;

    exercise.forEach((exercise, index) => {
        $('#my_form').append(getExerciseBlock(index, exercise));
            console.log(exercise);
        });
    });
});

我的 JSON 如下所示:

{
    "main_object": {
        "id": "new",
        "getExerciseTitle": "Example",
        "language": "nl_NL",
        "application": "lettergrepen",
        "main_object": {
            "title": "Example",
            "language": "nl_NL",
            "exercises": [{
                "word": "Example",
                "syllables": [
                    "Example1",
                    "Example2",
                    "",
                    ""
                ]
            }
        ]
    },
    "dataType": "json"
    }
}

编辑:有人要求我提供这些功能:

getWordInput 是 word 应该去的函数(当从我的 JSON 中取回时)

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

getWordPartInput = 我的 JSON 文件中有效的音节。

// This is the function that creates the syllable inputs.
function getWordPartInput(id, cValue){
 cValue = cValue || '';
var wpInput = $('<input/>', {
'class': 'form-group form-control syllable syl ' + TT ++,
'type': 'text',
'value': cValue,
'placeholder': 'Syllables',
'name': 'Syllablescounter['+ SyllablesID++ +']'
 });
 return wpInput;
}

要求的代码位，但对我来说看起来毫无用处:

function getAudioBtn(id, cValue){
 cValue = cValue || '';
  var audioBtn = $('<a/>', {
                'class': 'sound btn btn-primary'
            }).html('<i class="fa fa-volume-up"></i>');
 return audioBtn;
}

function getRemoveBtnExercise(target, i){
var RemoveExerciseBtn = $('<a/>', {
  'class': 'btn btn-danger'
 }).on('click', function(){  
 console.log($('.eblock').prop('id'))
    $('#' + target).remove();
}).html('<i class="fa fa-close"></i>');

return RemoveExerciseBtn;
}

下面的这段代码是一个添加按钮，单击时会创建包含所有功能的 eBlock。例如，当主持人想要创建一个全新的练习时，将使用此按钮。

$(document).ready(function() {
 var id = 0;
 var addOpdracht = $('<a/>', {
'class': 'btn btn-success',
'id': 'addOpdracht'
  }).on('click', function() {
  $('#my_form').append(getExerciseBlock(id));
  $(".exerciseGetWordInput_" + id).focus().select();
 id++;
 exerciseAudioInput++;
}).html('<i class="fa fa-plus fa-2x"></i>');

 $('#my_form').append(addOpdracht);
 $('#my_form').append(getExerciseTitle());
});

Answer 1

您只是在 getWordInput() 函数中缺少 'value': cValue,。编辑如下:

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