如何隐藏表单的某些部分答案

【问题标题】：how do I hide certain part of form如何隐藏表单的某些部分
【发布时间】：2010-05-25 17:20:20
【问题描述】：

我有一个表单，它包含下拉框和不同的 div 项。基于从下拉框中的选择，我显示了这些 div 项。但是这些 div 项中的某些文本会在加载表单时显示，而不是在我从下拉框中选择选项时显示。代码有点像这样

<form>
      <select id="">
          <option value="one"> One </option>
          <option value="two"> Two </option>
          <option value="three"> Three </option>
      </select>
      <div id="onee"> header text ..<table> </table></div>
      <div id="twoo"> header text ..<table> </table></div>

</form>

所以当我加载带有选择下拉框的页面表单时，它还会显示 div 内的标题文本。如何隐藏该文本？

【问题讨论】：

标签： forms html

【解决方案1】：

 <div id="onee" style="display:none"> header text ..<table> </table></div>
      <div id="twoo" style="display:none"> header text ..<table> </table></div>

所以页面加载的完整代码是

<form>
      <select id="">
          <option value="one"> One </option>
          <option value="two"> Two </option>
          <option value="three"> Three </option>
      </select>
      <div id="onee" style="display:none"> header text ..<table> </table></div>
      <div id="twoo" style="display:none"> header text ..<table> </table></div>

</form>

在此之后，当您更改选择框中的选项时

只需替换display:none with display:block

【讨论】：

【解决方案2】：

如果您使用 JavaScript 根据选择显示 div，您也可以在最初隐藏所有 div。这是在 JQuery 中的操作方法：

$("#onee").hide();
$("#twoo").hide();

或者您可以使用 CSS 隐藏它们：diplay:none。

如果您在下拉列表中使用回发，您可以在服务器端控制 html 输出，并且只呈现您需要的 div。

【讨论】：

【解决方案3】：

您可以在 display:none 处启动这些 div。

【讨论】：