单击事件后按钮消失以切换css类

时间:2014-02-17 04:34:09

标签: jquery

我将toggle类添加到我的click处理程序中,当我运行webapp并单击其中一个div来切换其类时,动态表和div消失。

有问题的代码是..

 $(document).ready(function () {
        var MyResult;
        $("div").click(function () {

            $("div").toggle(function () {
                $("div").addClass("CheckBoxSubjects");
            }, function () {
                $("div").removeClass("CheckBoxSubjects");
            });

            var divID = this.id;

            MyResult = MyResult + divID + ",";
            $("#NewResult").text(MyResult);

        });
    });

使用动态表,它也创建了div,并且在创建所有内容时我已经为div设置了类。

我认为我的代码搞砸了,因为看起来好像它应该可以工作(反正对我来说),但是由于我不熟悉jquery,我很可能在某个地方犯了错误。

1 个答案:

答案 0 :(得分:0)

尝试

$(document).ready(function () {
    var ids = [];
    $("div").click(function () {
        $(this).toggleClass("selected");
        var divID = this.id;

        var index = $.inArray(this.id, ids);
        if (index > -1) {
            ids.splice(index,1);
        } else {
            ids.push(this.id);
        }
        $("#NewResult").text(ids.join());
    });
});

然后

.CheckBoxSubjects {
    border-style: solid;
    border: 1px solid #78E389;
    width: 122px;
    height: 27px;
    border-radius: 5px;
}
.CheckBoxBorder {
    border-style: solid;
    border: 1px solid lightblue;
    width: 58px;
    height: 27px;
    border-radius: 5px;
    background-color:lightblue;
}
.CheckBoxSubjects.selected {
    background-color:#78E389;
}

演示:Fiddle