使用标签创建 HTML 表单答案

【问题标题】：Creating HTML Forms with Tabs使用标签创建 HTML 表单
【发布时间】：2015-09-21 22:29:25
【问题描述】：

这是我第一次尝试构建单页网络应用程序。我首先处理页面的布局。我已经完成了 99% 的 CSS（使用引导程序）。但是，我现在需要向我的页面添加一个表单。该表单将在服务器上启动脚本。

我希望表单具有用户可以单击的选项卡，并且每个选项卡显然包含不同的输入字段（文本框、下拉列表、复选框等...）。但是，我没有看到任何关于如何纯粹使用 HTML/CSS 甚至 js 来完成此任务的好的教程。

我不想在这里重新发明轮子，但我想要一个响应式的表单，并且可以在不重新加载页面的情况下动态更新。我更喜欢纯 HTML/CSS，但如果需要 js，那也可以。

我不确定我是应该自己从头开始创建这个 HTML 表单，还是使用框架或模板。

【问题讨论】：

几件事，首先你的问题不包含问号。你真的需要一个明确的问题，这样人们就知道他们在回答什么:)
其次 - 你已经在使用一个框架，可以完成你所要求的简洁的表单和标签，这只是将两者结合起来的一个例子 - 看看这里getbootstrap.com/javascript/#tabs 标签是如何工作的.
卡拉有一点，in10s1。虽然说需要知识并解释您缺乏相关知识是有道理的，但那些为了效率而扫描问号而不阅读整个问题的人可能会感到困惑。

【解决方案1】：

大多数时候我看到创建的标签，它们不是“真正的”标签。只需制作与选项卡数量相等的多个 div，将它们放置在同一位置，然后让您单击的每个选项卡激活 java-script 以将其各自链接的 div 设置为可见，其他设置为隐藏。

【讨论】：

【解决方案2】：

由于您已经在使用 Bootstrap + Jquery，我建议您使用 bootstrap 的Toggleable Tabs 组件。

此外，对于这种使用标签创建表单的特定情况，这篇文章可能会很有用：http://formvalidation.io/examples/bootstrap-tab/

【讨论】：