jquery - Jquery .on方法不一致无响应

Question

我有两个直接在彼此顶部的单选按钮。每个都显示其各自的 div 并隐藏另一个收音机的 div。除了名称之外，关于它们的一切都是相同的——“#fed”有效，“#state”无效。有什么想法吗？

HTML：

<label class="radio"><input type="radio" name="jur" id="fed" /> Federal</label>
        <span class="searchtype" id="feddiv"></span>

<label class="radio"><input type="radio" name="jur" id="state" /> State</label>         
        <span class="searchtype" id="statediv" ></span>

Javascript：

$('#state').on('click',function(event) {
    $('#statediv').show();
    $('#feddiv').hide();
});
$('#fed').on('click',function(event) {
    $('#feddiv').show();
    $('#statediv').hide();
});

Answer 1

而不是.on('click', function(){});为什么不使用.click(function(){});？

此外，在“标签”而不是“输入”中设置ID，以便用户可以单击文本以隐藏其​​余部分。