jQuery-基于单选按钮选择显示div

jQuery-基于单选按钮选择显示div,jquery,forms,radio-button,selection,Jquery,Forms,Radio Button,Selection,可能的解决方案,但无法使其工作: $(function(){ $('input[name="q10"]').click(function(){ if ($(this).is(':checked')) { var flag=0; $("input[type='radio']:checked").each(function() { if($(this).val()==1 || $(this).val()==2 ){ $("#disag

可能的解决方案,但无法使其工作:

$(function(){
  $('input[name="q10"]').click(function(){
    if ($(this).is(':checked'))
    {
    var flag=0;

    $("input[type='radio']:checked").each(function() {
      if($(this).val()==1 || $(this).val()==2 ){
        $("#disagree").show();
         flag++;
      }
      else if(($(this).val()==3 || $(this).val()==4) && flag==0)
        $("#agree").show();
    });
    }
  });
});
我的页面上有10个问题,每个问题的回答量表如下:

<div id="rq1" class="row" onmouseover="changeBackgroundColor(this.id)" onmouseout="changeBackgroundColor2(this.id)">
<div class="col1">1.</div>
<div class="col2a">Question text</div>
<div class='colans'>
      <input  name='q1' value='4' id='q1a4' type='radio' onclick='mand();' />
</div>
<div class='colans'>
      <input  name='q1' value='3' id='q1a3' type='radio' onclick='mand();' />
</div>
<div class='colans'>
      <input  name='q1' value='2' id='q1a2' type='radio' onclick='mand();' />
</div>
<div class='colans'>
      <input  name='q1' value='1' id='q1a1' type='radio' onclick='mand();' />
</div>
<div class='colans'>
      <input  name='q1' value='-1' id='q1a-1' type='radio' onclick='mand();' />
</div>
</div>

1.
问题文本
上述10个问题q1到q10中的每一个都是重复的

在10个问题的末尾,我有两个
textarea
,用户可以在其中写评论,但是,如果用户选择任何值为2或1的响应,则需要出现第一个
textarea
。如果用户选择值为4或3的任何
响应,但尚未选择值为2或1的响应,则需要显示第二个
文本区域

最后,我需要在用户回答最后一个问题(问题10)后运行jQuery——此时我需要启动代码

在过去,我为每个响应手动创建了Javascript代码并进行了检查,但我想知道是否有一种更整洁、更简洁的方式使用jQuery

var flag=0;

$("input[type='radio']:checked").each(function() {
  if($(this).val()==1 || $(this).val()==2 ){
    $("#myTextArea1").show();
     flag++;
  }
  else if(($(this).val()==3 || $(this).val()==4) && flag==0)
    $("#myTextArea2").show();
});
在回答最后一个问题时触发此代码

更新: 这是完整的代码

 $(document).ready(function() {

   $("#disagree").hide();
   $("#agree").hide();

   $("input[name='q10']").click(function() {

    $("#disagree").hide();
    $("#agree").hide();

    var flag=0;

    $("input[type='radio']:checked").each(function() {

       if($(this).val()==1 || $(this).val()==2 ){

           $("#disagree").show();
           $("#agree").hide();
           flag++;
       }

      else if(($(this).val()==3 || $(this).val()==4) && flag==0)

           $("#agree").show();
   });
 });    
});

我没有很好地格式化代码,但我想这会对你有所帮助。我还检查了最后给出的答案,我想每次访问这个对象都不是一个好主意。但这只是我的意见。祝您一切顺利:-)

对于您在上一个答案中添加的注释,您可以添加以下代码

`if ( $('.myClass').filter(function(){
    return $(this).val() != '';
    }).length == 0
 )
 {
  /* code to run when all are empty */

 }`

您可以将此类名myClass添加到文本框中,这样当所有文本框都被应答时,您就可以为radiobutton触发代码。:-)

感谢@rps-这对于简单地显示相关文本区域很好-问题如下:1。第二个文本区只能在用户没有为10个问题中的任何一个选择1和2时显示,我需要在他们回答q10后立即启动代码(因此需要一次性检查所有问题-而不是在他们进行选择时启动)@Homer_J no,在回答所有问题时不需要启动上述代码g,就为了回答最后一个问题而触发它,那将是doThanks@rps-正在尝试实现-问题-即使用户选择q10选项时我触发了代码,这个问题是否会问q1到q10的所有问题?@Homer_J onclick本身是否工作?if(checked)条件中的代码是否着火?先生,你为什么要检查“检查”状态?这不是一个复选框,而是一个单选按钮,它不会在单击鼠标右键时被取消选中?我需要在单击q10的响应时触发您的jQuery代码(因此我要检查q10是否被选中)-工作正常,就像我正确触发
警报一样。但是,当我添加你的代码时,它不起作用。谢谢,但再次强调,这只提供了部分解决方案-请参阅下面我对rps的回复。我已编辑了我的答案。这将检查您的所有答案,如果您将使用相同的类名作为所有html控件的答案。您能告诉我您在上述解决方案中遇到了什么错误吗?上述代码在实现时仅检查1个问题-我需要检查问题1到10,以查看回答者选择了什么。有什么想法吗?
`if ( $('.myClass').filter(function(){
    return $(this).val() != '';
    }).length == 0
 )
 {
  /* code to run when all are empty */

 }`