Question

我有以下功能：

function add() {
    for (var i = 0; i < 49; i++) {
    var b = Math.floor(Math.random() * 50) + 1;
    document.getElementById("tt5").innerHTML += b + " ";
  }
}

单击按钮后->将在textarea（“ tt5”）中输出50个不同的整数（从1至50）
但是现在我又得到了两个额外的textareas，它们具有相同的id =“ tt5”，但这根本不影响他们...

<button onclick="add()">OK</button>
<textarea class="textarea2" name="t5" id="tt5"></textarea>
<textarea class="textarea3" name="t5" id="tt5"></textarea>
<textarea class="textarea4" name="t5" id="tt5"></textarea>

我希望所有文本区域都用add-function（）填充

Answer 1

您在标记中有一些向后键。您正在使用唯一的 classes 和非唯一的 ids 。应该是相反的方式：

<textarea class="textarea" name="t5" id="tt1"></textarea>
<textarea class="textarea" name="t5" id="tt2"></textarea>
<textarea class="textarea" name="t5" id="tt3"></textarea>

这是因为DOM中的任何id必须是唯一的（“ id”是“ identifier”的缩写）。但是您可以在任何喜欢的地方应用课程。然后，您可以使用其他函数来获取匹配元素的数组：

var textareas = document.document.getElementsByClassName("textarea");
for (var j = 0; j < textareas.length; j++) {
    textareas[j].innerHTML += b + " ";
}

有一些更高级的方法可以将多个元素应用于多个元素或对数组多次应用函数，但是由于您已经熟悉循环，因此至少应该足以开始使用循环。另请注意，如果您完全提交表单，则重复name值可能会导致意外的结果。发送到服务器的键/值对需要唯一的名称。

功能->许多不同的textareas，但是一个特定的id

1 个答案: