如何基于单选按钮显示表单元素

Question

我正在创建一个新的应用程序，在这个应用程序中，我设计了一种表单，其中的元素根据无线电按钮列表的选择而不同。例如-我有一个无线电按钮列表-性别和选择是男性和女性。

的男性：的下一个元素的形式将是textfield 课外活动：和学生可以键入任何类似柔道，空手道等。

表示女性：下一个元素的表单将是下拉菜单课外活动：有选项，舞蹈，芭蕾舞等，根据选择上述无线电按钮，下一个元素应显示，输入的数据将转换为JSON格式，并存储在数据库中。

现在，为了实现这一点，我在一个div中放置了与下拉列表相同的字段，在另一个div中放置了textfield。我使用jQuery分别隐藏和显示div。

备注-课外活动被用作男生的课文栏，女生的课文栏。我做得对吗。

Answer 1

这感觉有点烦躁，但这里有一个例子：

http://jsfiddle.net/3s8wM/

here's my "accompanied code" to make SO happy about jsfiddle links :P

我在这里所做的基本上就是你已经在做的事情，区别是我把你不想把表单中的元素放到隐藏的div中。

不过，我的建议是采取一些不同的做法。为什么把女性的选择限制在下拉，而男性的选择是完全开放的？我认为你在这里自找麻烦--你不想让你的用户觉得你对任何性别都有偏见。

我会为男性和女性选择另外一个“其他.”选择。如果选择该选项，则显示要向其添加活动的文本区域。这样，您将有相同的表单元素来处理男性或女性，并将使您的开发更容易和更易于维护。

编辑

要回答你的问题：“这是正确的方法吗？”，我不这么认为。由于textarea和select元素的名称相同，所以在$_POST变量中可能会得到奇怪的结果，这就是为什么如果您在处理$_POST变量时不打算使用它们，那么我选择将元素移出表单之外。