JQuery .show() - 没有效果

我在这里看了几个使用.show()的例子,但我仍然无法让我的工作.我的目标是在按下"gateNeededYes"单选按钮时弹出div"gateInformation".到目前为止,div一直隐藏着.如果有人能解释我哪里出错了,我将非常感谢!这是代码:CSS:

#gateInformation {
    display: block;
}

JS:

/门信息

if($('#gateNeededYes').prop('checked')){
        $("#gateInformation").show("blind" , 1000);
    }

HTML:

盖茨需要:

            No 
            Yes 
            

                Gates Needed: 
                
                    Select Gate Height
                    4 Ft. Gate
                    6 Ft. Gate
                    8 Ft. Gate
                
                Pool Spring and Latch: 
                
            

adeneo.. 5

如果你要展示一些东西,它必须开始隐藏

#gateInformation {
    display: none;
}

那么你需要一个事件处理程序

$('#gateNeededYes').on('change', function () {
    if (this.checked) {
        $("#gateInformation").show("blind", 1000);
    }
});

然后你必须包含jQuery UI才能使用效果 show()

小提琴