Question

我需要创建一个包含2个（是/否）选项的表单，如果用户单击其中一个选项，那么他应该获得一个折叠子表单，其中包含有关该特定选择的更多细节。如果他选择其他选项，那么他应该获得另一个具有相关信息的折叠子表单。我知道我们必须使用JavaScript或Jquery（以获得折叠效果），但我对两者都不熟悉。任何简单的教程或初学者信息都非常感谢。

PS：我已经看到很多关于这个要求的问题，但事实是我作为初学者很难理解它们。

谢谢，

Answer 1

基本上，您需要将两个不同的子表单包装在div中，然后使用jQuery .show（）和.hide（）函数在单击右侧单选按钮时显示和隐藏它们。

以下是有关展示和隐藏的有用教程：http://papermashup.com/simple-jquery-showhide-div/

编辑：更具体的用户答案..

$(document).ready(function(){
   $("#check-box").click( function(){
     if( $(this).is(':checked')) {
         $('#div1').show();
     } else {
        $('#div1').hide();
     }
  });

}）;

Answer 2

您必须渲染整个表单并隐藏所有子表单，每个子表单具有不同的ID。根据按下的按钮/选项，您可以使用以下代码在相应的$.show()上致电div：

$("#choice1_subform").click(function(){
    $("#div1").show();
});

创建动态表单

2 个答案: