Jquery单选按钮逻辑

Jquery radio buttons logic

本文关键字：单选按钮 Jquery      更新时间：2023-09-26

我在某个地方丢失了一段逻辑。我想知道这个单选按钮是真是假。

控制台显示：；

adjunct_prof
<input type=​"radio" name=​"adjunct_prof" id=​"adjunct_prof" value=​"False" checked=​"checked">​ 
<input type=​"radio" name=​"adjunct_prof" id=​"adjunct_prof" value=​"True">​

HTML是；

<div id="ProfessorDiv" class="span4">
    <div class="row">
        <div class="span4">
        Are you an adjunct professor?&nbsp;&nbsp;
        <input type="radio" name="adjunct_prof" id="adjunct_prof" value="False" 
        <cfif request.adjunct_prof EQ "False">  checked="checked"</cfif> /> No 
        <input type="radio" name="adjunct_prof" id="adjunct_prof" value="True" 
        <cfif request.adjunct_prof EQ "True"> checked="checked"</cfif>  /> Yes 
        </div>
    </div>
    <div class="row">
      <div class="span4" id="ProfSpecsDiv">
        <cfinclude template="adjunct_prof.cfm">
      </div>
    </div>
</div>

脚本是；

$("input:radio[name=adjunct_prof]").click(function(){
    var value = $(this).val();
    alert(value);
    if (value = 'True') {
        $('#ProfSpecsDiv').show();
    }
    else {
        $('#ProfSpecsDiv').hide();      
    }
});

警报显示True或False，具体取决于按钮的状态。但是当我点击"是"时，div就会显示出来。当我点击"否"时，什么也没发生。div仍然显示。开发工具显示每次都会执行"show"代码。我尝试过True和"True"作为默认if（value）｛.

if (value = 'True')

您使用了一个=而不是==，这将导致值始终指定为"True"，并且始终显示#ProfSpecsDiv。

不要多次设置相同的id。每个按钮都是一个元素。您可以改用class。

<input type=​"radio" name=​"adjunct_prof" class=​"adjunct_prof adjunct_prof_yes" value=​"False" checked> <!-- Simply checked is valid html5 -->​ 
<input type=​"radio" name=​"adjunct_prof" class=​"adjunct_prof adjunct_prof_no" value=​"True">​

您只需要检查其中一个框的值，因为它无论如何都是布尔值。您是否考虑过使用复选框？

$(".adjunct_prof").on('change', function(){
    if($('.adjunct_prof_yes').prop('checked')) {
        $('#ProfSpecsDiv').show();
    } else {
        $('#ProfSpecsDiv').hide();
    }
});
相关文章：