单选按钮选择包含单选按钮的表单，该单选按钮选择包含单选按钮的表单

Question

开始返回单选按钮是和否，问题 1，问题 1 是返回 Questio1.1 并隐藏按钮，依此类推。

“是”按钮的作用就像一个魅力，但我不知道如何使“否”按钮也能正常工作

谢谢。

    <div><input type='radio' name='opt' value='1' />I agree to start</div>

    <!-- Form 1-->

    <div class='content' id='content1'>
    <p>This is Question 1
    <br>'yes' will return Question 1.1y
    <br>'no' will return Question 1.1n</p>
    </div>
    <div class='info' id='info1'>
    <div><input type='radio' name='opt' value='2' />yes</div>
    <div><input type='radio' name='opt' value='6' />no</div>
    </div>

    <!-- Form 1.1y-->

    <div class='content' id='content2'>
    <p>This is Question 1.1y
    <br>'yes' will return Question 1.1.1y
    <br>'no' will return Question 1.1.1n</p>
    </div>
    <div class='info' id='info2'>
    <div><input type='radio' name='opt' value='3' />yes</div>
    <div><input type='radio' name='opt' value='7' />no</div>
    </div>

    <!-- Form 1.1.1y-->

    <div class='content' id='content3'>
    <p>This is Question 1.1.1y
    <br>'yes' will return answer_y
    <br>your 'no' will answer_n</p>
    </div>
    <div class='info' id='info3'>
    <div><input type='radio' name='opt' value='4' />yes</div>
    <div><input type='radio' name='opt' value='11' />no</div>
    </div>

    <!-- answer_y-->

    <div class='content' id='content4'>
    <div><p>answer_y</p></div>
    </div>

    <!-- answer_n-->

    <div class='content' id='content11'>
    <div><p>answer_n</p></div>
    </div>

    <!-- Form 1.1n-->

    <div class='content' id='content6'>
    <p>This is Question 1.1n
    <br>'yes' will return Question 1.1.1y
    <br>'no' will return Question 1.1.1n</p>
    </div>
    <div class='info' id='info6'>
    <div><input type='radio' name='opt' value='9' />yes</div>
    <div><input type='radio' name='opt' value='10' />no</div>
    </div>


     <!-- Form 1.1.1n-->

    <div class='content' id='content10'>
    <p>This is Question 1.1.1n
    <br>'yes' will return answer_y
    <br>'no' will return answer_n</p>
    </div>
    <div class='info' id='info10'>
    <div><input type='radio' name='opt' value='4' />yes</div>
    <div><input type='radio' name='opt' value='11' />no</div>
    </div>







.info { display: none; }
.content { display: none; }

 var update = function() { 
 $(".info").hide();
 $("#info" + $(this).val()).show();
 };
 $("input[type='radio']").change(update);


 var update1 = function() { 
 $("#content" + $(this).val()).show();
 };
 $("input[type='radio']").change(update1);

http://jsfiddle.net/j2x96buL/15/

Answer 1

使用复选框而不是单选框，这样您可以一次选择和取消选择多个。

然后，扩展您的函数以将每个表单的 id 传递给 hide 和 show 函数：

$('input[type="checkbox"]').change(function() {
  var val = $(this).val();
  $("#info" + val).show();
  if (!$(this).is(':checked')) {
    $("#info" + + val).hide();
  }
});

这是一个更新的小提琴： http://jsfiddle.net/j2x96buL/2/

Answer 2

问题在于您的HTML 结构。 （据此JSFiddle）

你在另一个里面有.content。例如，#content3 在 #content2 内部。

您的代码用于隐藏所有.content 并单独显示相应的代码。但是你看不到#content3，只要它的父 #content2 是隐藏的（例如）。

你如何展示隐藏在某物内部的东西？

所以你需要正确地重新构建你的HTML。

旁注：您对同一事件的元素有多个处理程序，这可能会导致不可预测的行为。您实际上只需要一个，您可以在其中编写所有逻辑：

$("input[type='radio']").change(function () {
  // all the logic goes here
  // no need of a separate handler for doing something else
});

更新（OP不断更改代码）

根据最新的代码，你有 value10 的单选按钮，但是有 mo 匹配 #info10、#content10 等。所以什么都没有显示。