Question

                    $(document).ready(function() {

            $("span#label_Flat").hide();
            $("span#added_Flat").hide();
            $("span#removed_Flat").hide();



            if ($('#Flat:checked').val() != false) {

                $('#Flat').click(function() {
                    $("span#label_Flat").toggle();
                    $("span#removed_Flat").toggle();

                });

            } else {

                $('#Flat').click(function() {
                    $("span#label_Flat").toggle();
                    $("span#added_Flat").toggle();

            });                 
        });

有人能指出我为什么这不起作用的方向吗？

我想要隐藏三个跨度，只能切换其中两个，这取决于是否选中了复选框。

目前，跨度未被隐藏，因此不要在隐藏和显示之间切换。

html是：

<input id="Flat" type="checkbox" name="Flat" checked />


<p>
<span id="label_Flat">Flat: </span>
<span id="added_Flat">Added</span>
<span id="removed_Flat">Removed</span>
</p>

提前感谢您的帮助。

示例可以在这里看到：http://jsfiddle.net/WEq5u/10/

Answer 1

我认为你正在寻找这个。要查看是否选中了复选框，您可以使用this.checked属性，如果选中该属性将返回true，或者false。

        $(document).ready(function() {

            $("span#label_Flat").hide();
            $("span#mp_Flat").hide();
            $("span#removed_Flat").hide();

            $('#Flat').click(function() {
                if(this.checked){
                   $("span#label_Flat").toggle();
                   $("span#removed_Flat").toggle();
                }
                else{
                   $("span#label_Flat").toggle();
                   $("span#mp_Flat").toggle();
                }
            }).click();

        });

Answer 2

在黑暗中拍摄，但我认为

 if ($('#Flat:checked').val() != undefined) {

应该是

 if ($('#Flat:checked').val() != false) {

检查val应该返回true或false，并且只有在我不知道它不是复选框时才定义。

Answer 3

这应该有用，我已经使用了ShankarSangoli的代码，如果页面加载时选中了复选框，则添加了案例。

$(document).ready(function () {
    $("span#label_Flat").hide();
    $("span#mp_Flat").hide();
    $("span#removed_Flat").hide();

    if ($('#Flat').attr('checked') == true) {
        $("span#label_Flat").toggle();
        $("span#removed_Flat").toggle();
    }
    else {
        $("span#label_Flat").toggle();
        $("span#mp_Flat").toggle();
    }
    $('#Flat').click(function () {
        if (this.checked) {
            $("span#label_Flat").toggle();
            $("span#removed_Flat").toggle();
        }
        else {
            $("span#label_Flat").toggle();
            $("span#mp_Flat").toggle();
        }
    });
});

Jquery If语句 - 切换函数

3 个答案: