检查选定值的所有单选按钮

我有一个问题列表。一次可以看到一个问题 - 其他隐藏的问题 - 当您查看您接下来按下的每个问题时。您也可以按回去并随时更改答案。检查选定值的所有单选按钮

我想弄清楚到目前为止是否有任何问题已经回答否 - 如果他们已经显示此项目。否则显示其他。

标记：

<div id="audit"> 
    <p> 
     <label class="check-label">Question 1</label> 
     <br /> 
     <input type="radio" value="Yes" id="CAT_Custom_235312_0" name="CAT_Custom_235312" class="required" />Yes 
     <br /> 
     <input type="radio" value="No" id="CAT_Custom_235312_1" name="CAT_Custom_235312" class="required" />No</p> 
    <p> 
     <label class="check-label">Question 2</label> 
     <br /> 
     <input type="radio" value="Yes" id="CAT_Custom_235313_0" name="CAT_Custom_235313" class="required" />Yes 
     <br /> 
     <input type="radio" value="No" id="CAT_Custom_235313_1" name="CAT_Custom_235313" class="required" />No</p> 
    <p> 
     <label class="check-label">Question 3</label> 
     <br /> 
     <input type="radio" value="Yes" id="CAT_Custom_235314_0" name="CAT_Custom_235314" class="required" />Yes 
     <br /> 
     <input type="radio" value="No" id="CAT_Custom_235314_1" name="CAT_Custom_235314" class="required" />No</p> 
</div> 
<div class="granted" style="display: none;">Yes</div> 
<div class="denied" style="display: none;">No</div>

而且JS

$('input[type="radio"]').click(function() { 
    if ($('input[type=radio]:checked').val() == 'No') { 
     $('.denied').show(); 
     $('.granted').hide(); 
    } else { 
     $('.granted').show(); 
     $('.denied').hide(); 
    } 
});

这里是什么，我至今一的jsfiddle：http://jsfiddle.net/5ZKyH/1/（仅收音机）

它的工作原理上的第一个项目，但之后没有更多。我可以根据需要多次更改第一个答案，它会交换，但是如果我回答问题二，则什么都不会发生。

在它需要准确地告诉我，是任何一个问题的回答结束NO

不能完全似乎弄清楚如何将所有的输入每次检查。

来源

2013-04-10 Justin

尝试使用下面的JavaScript：

$("#audit").on("click", 'input[type="radio"]', function() { 
    var allRadios = $('input[type="radio"]'); 
    var checkedNo = allRadios.filter(function() { 
     return $(this).is(":checked") && $(this).val() === "No"; 
    }); 
    if (checkNo.length > 0) { 
     $('.denied').show(); 
     $('.granted').hide(); 
    } else { 
     $('.granted').show(); 
     $('.denied').hide(); 
    } 
});

DEMO：http://jsfiddle.net/ma7k9/1/

它可以过滤对被检查的单选按钮和具有value “否”。如果找到，则显示“.denied”元素，否则显示“.granted”元素。

请注意我是如何更改事件绑定的。这使用事件委派，并将一个事件绑定到<div id="audit">元素...而不是每个单选按钮的一个事件。对我来说，这是有道理的，以防万一你在页面上有其他的单选按钮，并且不希望将它们作为目标，并减少绑定的处理程序的数量。

当在#audit div内发生单击事件时，回调处理程序仅在目标元素（其中发生事件的位置）与选择器input[type="radio"]匹配时才执行。从那里，回调执行逻辑。

来源

2013-04-10 05:08:59 Ian

这工作一种享受，我很欣赏的方式和原因进行了更改的说明。更容易遵循和学习。 – Justin 2013-04-10 05:58:07

在选择器结果上使用.each()对jquery中的复选框进行迭代，然后根据其中是否标记为“否”来正确运行。

$('input[type="radio"]').click(function() { 
    var anyNos = false; 
    $('input[type=radio]:checked').each(function(e) { 
     if ($(this).val() == 'No') { 
      anyNos = true; 
      return false; 
     }    
    }); 

    if (anyNos) { 
     $('.denied').show(); 
     $('.granted').hide(); 
    } else { 
     $('.granted').show(); 
     $('.denied').hide(); 
    } 
});

来源

2013-04-10 05:10:46 FoolishSeth

$('input[type="radio"]').click(function() { 
    if ($('input[type=radio]:checked').val() == 'No') { 
    $('.denied').show(); 

     $("#2p").show(); 
      $("#3p").hide(); 

     if($("input[name='CAT_Custom_235313']:checked").val()=='No') 
     { 
      // alert($("CAT_Custom_235313_1").val()); 
     $("#3p").show(); 
     } 
} else { 

} 
});

DEMO ::http://jsfiddle.net/Praveen16oct90/5ZKyH/4/

来源

2013-04-10 05:19:12 PraJen

检查选定值的所有单选按钮

回答

相关问题