Javascript 如果选中值为阴性的单选按钮，则显示类别阴性，隐藏类别阳性

我不知道我做错了什么，有人能帮忙吗？我有两个单选按钮。如果选择了女性选项，我想隐藏带有“男性”类的下拉菜单，并显示带有女性类的下拉菜单，如果选择了男性值，则执行相反的操作。 以下是我尝试过的：

$（文档）.ready（函数（）{
$（'input[type=radio]'）。单击（函数（）{
如果（$（'input[value=Female]'）。是（'checked'））{
$（'.female'）.show（）；
$（'.male'）.hide（）；
}如果（$（'input[value=Male]'）。为（'checked'），则为else{
$（'.male'）.show（）；
$（'.female'）.hide（）；
}否则{
$（'.male'）.hide（）；
$（'.female'）.hide（）；
}
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
选中
是一个psedo选择器，应该被选中


$（文档）.ready（函数（）{
$（'input[type=radio]'）。单击（函数（）{
如果（$（'input[value=Female]'）。是（':checked'））{
$（'.female'）.show（）；
$（'.male'）.hide（）；
}如果（$（'input[value=Male]'）。是（':checked'））{
$（'.male'）.show（）；
$（'.female'）.hide（）；
}否则{
$（'.male'）.hide（）；
$（'.female'）.hide（）；
}
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
选中
是一个psedo选择器，应该被选中


$（文档）.ready（函数（）{
$（'input[type=radio]'）。单击（函数（）{
如果（$（'input[value=Female]'）。是（':checked'））{
$（'.female'）.show（）；
$（'.male'）.hide（）；
}如果（$（'input[value=Male]'）。是（':checked'））{
$（'.male'）.show（）；
$（'.female'）.hide（）；
}否则{
$（'.male'）.hide（）；
$（'.female'）.hide（）；
}
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
您的问题是因为您在
is（）
方法调用中使用了
checked
，而不是
：checked
。还要注意，为了遵循最佳实践，在处理收音机和复选框时，您应该使用
change
事件，以便通过键盘导航的用户仍然可以选择元素

也就是说，您可以使用
选择
元素上的
toggle（）
方法，分别检查选中单选按钮的值，从而缩短逻辑。试试这个：


$（文档）.ready（函数（）{
$（'.testtest'）.change（函数（）{
$（'.female'）.toggle（this.value=='female'）；
$（'.male'）.toggle（this.value=='male'）；
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
您的问题是因为您在
is（）
方法调用中使用了
checked
，而不是
：checked
。还要注意，为了遵循最佳实践，在处理收音机和复选框时，您应该使用
change
事件，以便通过键盘导航的用户仍然可以选择元素

也就是说，您可以使用
选择
元素上的
toggle（）
方法，分别检查选中单选按钮的值，从而缩短逻辑。试试这个：


$（文档）.ready（函数（）{
$（'.testtest'）.change（函数（）{
$（'.female'）.toggle（this.value=='female'）；
$（'.male'）.toggle（this.value=='male'）；
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
checked
是一个伪选择器，应该像
：checked
一样使用它。我建议您使用单选按钮
change
。您可以使用它，也可以使用
$（this）.val（）
获取当前值，并基于该值隐藏元素。请参阅下面的工作片段：


$（文档）.ready（函数（）{
$（'input[type=radio]'）。在（'change'，function（）上{
var值=$（this.val（）；
如果（值=‘女性’）{
$（'.female'）.show（）；
$（'.male'）.hide（）；
}else if（值=‘男性’）{
$（'.male'）.show（）；
$（'.female'）.hide（）；
}否则{
$（'.male'）.hide（）；
$（'.female'）.hide（）；
}
});
});



女性


男性


请选择响应
女性-小型
女性-中等
女性-大型


请选择响应
男-小
男-中
男-大
checked
是一个伪选择器，应该像
：checked
一样使用它。我建议您使用单选按钮
change
。您可以使用它，也可以使用
$（this）.val（）
获取当前值，并基于该值隐藏元素。请参阅下面的工作片段：


$（文档）.ready（函数（）{
$（'input[type=radio]'）。在（'change'，function（）上{
var值=$（this.val（）；
如果（值=‘女性’）{
$（'.female'）.show（）；
$（'.male'）.hide（）；
}else if（值=‘男性’）{
$（'.male'）.show（）；
$（'.female'）.hide（）；
}否则{
$（'.male'）.hide（）；
if( $('input[value=Female]').attr('checked')){
    ...
} ...