javascript – 使用jQuery显示/隐藏Checkbox

我试图根据复选框显示/隐藏html表单的一部分.这是我的基本代码：

<script src="/js/jquery.js"></script>
<script language="JavaScript">
    function toggle(className){
        var $input = $(this);
        if($(this).prop('checked'))
            $(className).show();
        else
            $(className).hide();
        }
</script>

<fieldset><legend>Check Here
    <input type="checkbox" onclick="toggle('.myClass')" ></legend>
    <span class="myClass">
        <p>This is the text.</p>
    </span>
</fieldset>

当您单击复选框时,跨度将被隐藏,并且不会再返回.我还使用了$(this).is(‘：checked’).似乎$(this).prop(‘checked’)正在评估是否检查它是否为false.我最好的猜测是我正在使用$(this).我在这里想念的是什么？

HTML,从点击事件传递此信息

<input type="checkbox" onclick="toggle('.myClass', this)" ></legend>

JS

function toggle(className, obj) {
    var $input = $(obj);
    if ($input.prop('checked')) $(className).hide();
    else $(className).show();
}

或者,不使用道具,你可以这样做：

function toggle(className, obj) {
    if ( obj.checked ) $(className).hide();
    else $(className).show();
}

或者,使用 .toggle( display ) 在一行中：

function toggle(className, obj) {
    $(className).toggle( !obj.checked )
}