如果单选按钮.is（'：选中'） - 无法正常工作

Question

我有一个javascript代码，用于在检查单选按钮时显示字段。代码工作正常，但是当我取消选中收音机时，该字段不会隐藏。选中单选按钮时，它还显示<span>，但如果未选中，则跨度也不会隐藏..

<script>
$(function() {
    $('#radiopromo2').live('change', function() {
        if($(this).is(':checked')) {
            $("#fieldtraining").show();
            $("#radio3").show();
        } else {
            $("#fieldtraining").hide();
            $("#radio3").hide();
        }
    }).trigger('change');
});
</script>

任何可以帮助我的人？我做了一个jsfiddle http://jsfiddle.net/4UH2H/8/

Answer 1

尝试使用更合适的.prop()：

if($(this).prop('checked')){

甚至是普通的旧Javascript（它的速度更快）：

if(this.checked){

这总是对我有用。此外，.live()已被弃用，而.on()也被弃用，对于单选按钮，最好使用click而不是change，因为较旧的webkit版本错误无法正确识别更改：

$('#radiopromo2').on('click',function(){

通过这些改变你应该是金色的。

修改 根据{{​​3}}，您的事件未被正确的选择器触发。这是更新的内容：

$('input[name="radiotraining"]').on('click', function () {
    if ($('#radiopromo2').prop('checked')) {
        $("#fieldtraining").show();
        $("#radio3").show();
    } else {
        $("#fieldtraining").hide();
        $("#radio3").hide();
    }
});

有效！好极了！虽然看看你的jsFiddle，你真的应该考虑使用CSS代替jQuery来实现这样的基本显示/隐藏：

#fieldtraining,#radio3 {
    display:none;
}

#radiopromo2:checked + #radio2 > #radio3 {
    display:inline;
}

#radiopromo2:checked ~ #fieldtraining {
    display:block;
}

与IE9 +和所有真正的浏览器（yay CSS3！）一起使用会比JS更快，即使greyhairs在浏览器上关闭JS也能正常工作。您可以为那些蹩脚的旧浏览器（如IE6）保存jQuery。 jsFiddle here表明我的意思。

Answer 2

the behavior of .is() method in jquery is not as expected.Instead of .is() use .attr():
if($(this).attr("checked") == "checked")){
// code goes here
}