JQuery Focus事件似乎没有正常工作

Question

正在尝试使用jQuery焦点事件来处理以下内容：

搜索有三个标准，即邮政编码，城市，半径。用户可以选择一个sinngle，并由"无线电"按钮显示。

要求是，当用户单击文本框时，应选择其相应的广播按钮，但似乎无法正常工作。

jQuery如下：

$(".criteria input[type='text']").focus(function(){
    $(".criteria input[type='radio']").attr('checked', false);
    $(this).parent().find("input[name='SearchRange']").attr('checked',true);
});

HTML如下

<section class="row searchgroup criteria"> 
                <section class="col-xs-12">
                    <div class="fieldgroup">
                        <input type="radio" name="SearchRange" id="PostalCode" />
                        <label for="PostalCode">Postal Code</label>
                        <input type="text" id="PostalCodeTxt" placeholder="PostalCode" /> 
                        <div class="clear">&nbsp;</div> 
                    </div>
                    <div class="fieldgroup">
                        <input type="radio" name="SearchRange" id="City" />
                        <label for="City">City</label>
                        <input type="text" id="CityTxt" placeholder="City" /> 
                        <div class="clear">&nbsp;</div>
                    </div>

                    <div class="fieldgroup">
                        <input type="radio" name="SearchRange" id="SearchRadius" />
                        <label for="SearchRadius">Search Radius</label>
                        <input type="text" id="SearchRadiusTxt" placeholder="SearchRadius" /> 
                        <div class="clear">&nbsp;</div>
                    </div>
                 </section>
            </section> <!--searchgroup-->

它可以在前几次工作，然后没有选中单选按钮。任何帮助都将不胜感激。

Answer 1

使用 .prop（）而不是 .ATTR（）

$(".criteria input[type='text']").focus(function(){
    $(".criteria input[type='radio']").prop('checked', false);   
    $(this).parent().find("input[name='SearchRange']").prop('checked',true);
});

也访问 .prop（）vs .attr（）

demo

Answer 2

您需要使用 prop() 设置checked（因为它是属性），而不是attr()：

$(".criteria input[type='text']").focus(function(){
    $(".criteria input[type='radio']").prop('checked', false);   
    $(this).parent().find("input[name='SearchRange']").prop('checked',true);
});

JSFIDDLE。