Javascript 使文本框可见

我有一个下拉列表，如果我点击它将从数据库中检索值。如果有4个值必须传递到文本框并使其可见。如果有5个值，则5个值必须可见。如果有4个值必须进入第5个框，则将有一个计数。如果有5个值，则计数必须进入第6个框。

---

如何操作？

如果文本框位于标记中，而您刚刚隐藏了它们（例如，

style=“display:none”

），则可以通过将它们的

样式设置为
来再次显示它们。display
属性设置为
”
：

例如，这里有一个按钮点击处理程序，它查找要显示的文本字段并显示它；如果没有更多要显示的内容，则会隐藏按钮：

var myForm = document.getElementById('myForm');

document.getElementById('btnShowField').onclick = function() {
  var index, field, foundOne, foundMore;

  foundOne = foundMore = false;
  for (index = 0; index < myForm.elements.length; ++index) {
    field = myForm.elements[index];
    if (field.type === "text" && field.style.display === "none") {
      if (!foundOne) {
        // Found one, show it
        field.style.display = "";
        foundOne = true;
      }
      else {
        // Found more, so we don't need to hide the button
        foundMore = true;
        break;
      }
    }
  }
  if (!foundMore) {
    // No more hidden fields, hide the button
    this.style.display = "none";
  }
};


通常情况下，结构会比这复杂一点，但这是总体思路


主题外：通过利用诸如、或之类的JavaScript库，可以大大简化这些工作。它们将消除浏览器之间的差异，并提供大量增值功能，因此您可以将注意力集中在实际要做的事情上，而不是浏览器的怪癖等。
？标记中是否已有输入框？数据库中的数据是如何到达客户机的？xml？json？到底是什么类型的文本框？你是说一个
？如果使用CSS使其不可见，则需要将CSS
display
属性更改为
block
。如果您使用了其他方法，那么是什么方法？@T.JCrowder:我已经让文本框不可见了：如果4个值来自db，那么四个文本框必须可见，计数应该移到第五个框。@daffodil:那么这将是第一部分，即
样式。显示
位。我添加了一个粗略的例子，但我强烈建议为这类事情提供一个库。J Crowder：在何处显示值如果2个值，那么2个框必须可见，然后在第3个框中计数。我使用下拉框进行操作
var myForm = document.getElementById('myForm');

document.getElementById('btnShowField').onclick = function() {
  var index, field, foundOne, foundMore;

  foundOne = foundMore = false;
  for (index = 0; index < myForm.elements.length; ++index) {
    field = myForm.elements[index];
    if (field.type === "text" && field.style.display === "none") {
      if (!foundOne) {
        // Found one, show it
        field.style.display = "";
        foundOne = true;
      }
      else {
        // Found more, so we don't need to hide the button
        foundMore = true;
        break;
      }
    }
  }
  if (!foundMore) {
    // No more hidden fields, hide the button
    this.style.display = "none";
  }
};

var textBox = document.createElement('input');
textBox.type = "text";
textBox.name = "somename";
formElement.appendChild(textBox);