Question

所以我有这个JSON格式

"questionList": [
    {
        "questionText": "Create a function that adds 2 parameters",
        "questionId": "1",
        "testCase": "3,5"
    },
    {
        "questionText": "Write a function that takes two integers, and subtracts the second from the first.",
        "questionId": "12",
        "testCase": "10,3"
    },...
]

我正在动态创建textareas，我可以回答每个问题。这是我的代码

var questionsDiv = document.getElementById("questions");
for (let i = 0; i < questions.length; i++) {
  var div = document.createElement('div');
  div.className = 'question';
  div.innerHTML = '<h3>Question ' + parseInt(i+1) + '</h3><h5>' + questions[i].questionText + '</h5><textarea rows="10" cols="130" id="questionText"' + questions[i].questionId + ' placeholder="Enter your answer here..."></textarea><br><br>'

  questionsDiv.appendChild(div);
}

最终目标是创建一个json，并为每个问题输入答案。但是，当我尝试在textarea中为每个文本获取文本时，我得到一个“无法读取属性值”的null。这些只是我尝试获取questionID 12的值。

console.log(document.question.questionText+questions[2].questionID.value);
console.log(document.getElementById("questionText12").innerHTML.value);
console.log(document.getElementById("questionText12").value);

如何使用普通JS动态获取textareas的每个值？

Answer 1

我认为你错放了双引号：
id="questionText"' + questions[i].questionId + '
应该是 id="questionText' + questions[i].questionId + '"
或者您的所有问题都具有相同的ID。

Answer 2

好吧有几个问题，其中一个是双引号，在你添加nr之前关闭你的id的值

<textarea rows="10" cols="130" id="questionText' + questions[i].questionId + '" placeholder="Enter your answer here..."></textarea>
//                                             ^ removed " here; added here   ^

之后，您可以通过

获得问题

document.getElementById('questionText12')

但是你不能做的是以下

console.log(document.question.questionText+questions[2].questionID.value);

这不会带给你任何东西，因为它会成为字符串连接。从本质上讲，它可能会引发错误。如果您需要使用计算从对象获取属性，您始终可以使用obj['questionText' + 12]包装计算，但我不认为您考虑的属性存在。

我无法使用纯JavaScript来使用document.getElementById动态访问textarea的内容

2 个答案: