单选按钮 - 显示基于与jQuery的选中按钮的DIV

Question

我想实现以下 - 从每个问题的列表中选择4个多选答案我需要显示用户是否通过显示是否正确一旦单选按钮被按下，它就是正确的或不正确的。

这是一个问题的例子：

<ol> 
<li id="question_one"> 
<p><input type="radio" name="question_1" value="answer_1" />Corn</p> 
<p><input type="radio" name="question_1" value="answer_2" />Cotton</p> 
<p><input type="radio" name="question_1" value="answer_3" />Rice</p> 
<p><input type="radio" name="question_1" value="answer_4" />Soybeans</p> 
</li> 
</ol> 

<div id="q1_answer_1" class="show_answer">Corn 11.0%</div> 
<div id="q1_answer_2" class="show_answer">Cotton 2.5%</div> 
<div id="q1_answer_3" class="show_answer">Rice 11.0%</div> 
<div id="q1_answer_4" class="show_answer">Soybeans 7.0%</div> 

，并将所得的jQuery：

$("#question_one input:radio:eq(answer_1)").click(function(){ 
$("#q1_answer_1").show(100); 
}); 

$("#question_one input:radio:eq(answer_2)").click(function(){ 
$("#q1_answer_2").show(100); 
}); 

$("#question_one input:radio:eq(answer_3)").click(function(){ 
$("#q1_answer_3").show(100); 
}); 

$("#question_one input:radio:eq(answer_4)").click(function(){ 
$("#q1_answer_4").show(100); 
}); 

我相信，这将无法工作，因为eq()将只数值工作？是否有相当于eq()的输入值？或者其他建议如何可以工作？

非常感谢

Answer 1

如果你希望它是多一点通用的，你可以做它的基础上的价值，就像这样：

$("#question_one :radio[name=question_1]").change(function() { 
    $("div.show_answer").hide(); 
    $("#q1_" + $(this).val()).show(100); 
});​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 

You can give it a try here，或者如果您需要更通用的，说你有多个问题，只是在一个容器包装每个HTML的块以上，例如<div class="question"></div>那么你可以做这样的事情：

$(".question :radio[name=question_1]").change(function() { 
    $(this).closest(".question").find("div.show_answer").hide() 
      .filter("[id$='" + $(this).val() +"']").show(100); 
});​ 

You can test that version here，它将适用于多个问题，无需为每个问题重复您的代码。

---

注释：

$(this).closest('li').find(':radio').attr('disabled', true); 

或者，如果你想：到第一后杀死它点击你有几种选择，你可以通过添加这给处理程序（test here）禁用它们（test here）：

$(this).closest('li').find(':radio').unbind('change'); 

Answer 2

尝试使用伪选择：检查，像这样： $（“＃question_one输入：检查”）......