显示：没有仍然继承

Question

动态创建的表单呈现异常即使禁用了样式表。

表单根据选择的选项显示和隐藏各种详细信息。

因此，例如，以下许多内容将使用 C#.net 呈现...

formOutput += "<div class=\"field textBox\" id=\"" + field.Id + "\"><div class=\"labelTB\"><label for=\"" + field.Id + "\" class=\"" + reqClass + "\">" + field.Name + requirement + "</label></div>" +
        "<input type=\"text\" class=\"numInput\" id=\"" + field.Id + "_tb\" name=\"" + field.Name + "\" onkeyup=\"Service.refresh(this); numCheck(this)\" onclick=\"numCheck(this)\" />" +
        // numButtons:
        "<div class=\"minus plusMinus\" id=\"minus_" + field.Id + "\" onmousedown=\"numBox(this)\" /></div>" +
        "<div class=\"plus plusMinus\" id=\"plus_" + field.Id + "\" onmousedown=\"numBox(this)\" /></div></div><br />";

...然后父节点被JS隐藏onload：

var setVisibility = function (id, bool) {
  try {
        get(id).style.display = (bool) ? "block" : "none";  
   } catch (e) {
     return false;
   }   
  return bool;
}

但是，当有大量隐藏字段时，我的表单中间会出现相当大的空间。

我尝试了各种解决方案，但收效甚微。简单地将所有内容向上移动并不容易（表格比我在这里展示的要复杂得多）......

我什至尝试过以下方法：

var setVisibility = function (id, bool) {
  try {
    get(id).style.display = (bool) ? "block" : "none";
    get(id).style.position = (bool) ? "relative" : "absolute";
    get(id).style.height = (bool) ? "auto" : "0px";
    var children = get("containerType").childNodes
    for (var i in children) {
      if (children[i].style) {
        children[i].style.display = (bool) ? "block" : "none";
        children[i].style.position = (bool) ? "relative" : "absolute";
        children[i].style.height = (bool) ? "auto" : "0px";
      }
    }
  } catch (e) {
    return false;
  }
  return bool;
}

是什么导致了这个问题？有解决办法吗？

（见下图）

Answer 1

您的代码末尾有一个 br 标记（在 id=plus_ 的 div 之后？？），无论您是否隐藏 div，它都会始终显示。您可以在其中一个 div 中添加 br-tag 来实现您想要的效果

formOutput += "<div class=\"field textBox\" id=\"" + field.Id + "\"><div class=\"labelTB\"><label for=\"" + field.Id + "\" class=\"" + reqClass + "\">" + field.Name + requirement + "</label></div>" +
        "<input type=\"text\" class=\"numInput\" id=\"" + field.Id + "_tb\" name=\"" + field.Name + "\" onkeyup=\"Service.refresh(this); numCheck(this)\" onclick=\"numCheck(this)\" />" +
        // numButtons:
        "<div class=\"minus plusMinus\" id=\"minus_" + field.Id + "\" onmousedown=\"numBox(this)\" /></div>" +
        "<div class=\"plus plusMinus\" id=\"plus_" + field.Id + "\" onmousedown=\"numBox(this)\" /></div><br /></div>";

...或者您可以只为 br-tag 提供一个类或 id 并使用它来显示和隐藏 div