JQuery .show() - 没有效果

Question

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

#gateInformation {
    display: block;
}

JS:

/门信息

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

HTML:

盖茨需要:

            No <input type="radio" name="gateNeeded" id="gateNeededNo" />
            Yes <input type="radio" name="gateNeeded" id="gateNeededYes" />
            <div id="gateInformation" name="gateInformation">
                Gates Needed: 
                <select name="gateHeight" id="gateHeight">
                    <option value="select">Select Gate Height</option>
                    <option value="4fg">4 Ft. Gate</option>
                    <option value="6fg">6 Ft. Gate</option>
                    <option value="8fg">8 Ft. Gate</option>
                </select>
                Pool Spring and Latch: 
                <input type="checkbox" name="psl" id="psl">
            </div>

Answer 1

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

#gateInformation {
    display: none;
}

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

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

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

小提琴