Question

我正在尝试使用jQuery在用户选择单选按钮组中的特定单选按钮（Other）时显示div。

html位于

之下

<div id="countries">

<input id="Washington_D.C" type="radio" name="location" value="Washington">Washington D.C</input>
<input id="Other" type="radio" name="location" value="">Other</input>
    <div id="other locations" style="display: none">
    </div>
</div>

使用JQuery代码：

$(document).ready(function(){
    $("radio[@name='location']").change(function(){
        if ($("radio[@name='location']:checked").val() == 'Other')
        $("#county_drop_down").show();
    });
 });

但是当我选择单选按钮Other时，它没有显示div其他位置。

Answer 1

您需要为其赋值Other。

因此，不是这样

<input id="Other" TYPE="RADIO" NAME="location" VALUE="">Other</input>

但是

<input id="Other" TYPE="RADIO" NAME="location" VALUE="Other">Other</input>

乍一看，你的jQuery代码看起来很好。不过我会更喜欢click change以上change，因为如果无法预选，{{1}}在第一次点击时不会被触发。

Answer 2

尝试

$("radio[name='location']").change(function(){
    if ($(this).val() === 'Other')
    {
        if($(this).is(":checked"))
        {
            $("#county_drop_down").show();
        }
    }
});

将单选按钮值设置为“其他”，以使此代码生效。

JQuery：在单选按钮选择上显示div

2 个答案: