js怎么实现点击选中，再次点击取消。

2024-11-19 09:35:35

推荐回答（5个）

回答1：

1、首先输入下方的代码：

3、然后这样就完成了。

回答2：

你好，下面是大概的效果，不过首先，你的包房名称要是唯一的，否则下列的代码会有bug，如果name不是唯一的，我可以提供另外一种思路给你


    zhong
    
    #divName { height:100px; }
    #divName label { display:inline-table; height:20px; line-height:20px; margin:0 5px; }
    .divImgIn { width:100px; height:100px; background:blue; color:#000; }
    .divImgOut { background:green; }

广州

上海

深圳

    $(function() {
        // 为 class = divImgIn 的控件绑定 click 事件
        $(".divImgIn").click(function() {
            // 使用 toggleClass ，如果 class 中没有 divImgOut 则附加上，有则减掉
            $(this).toggleClass("divImgOut");
            // 获得当前的 class ，要么是 divImgIn ，要么是 divImgIn divImgOut
            var css = $(this).attr("class");
            // 获得点击的房子的 name 属性
            var name = $(this).attr("name");
            // 这个逻辑判断根据你的需求写
            if (css != "divImgIn") {
                // 这句是加上一个label
                $("#divName").append($("" + name + ""));
            } else {
                // 这句是删除 label 中 name = name 的
                $("#divName").find("label[name='" + name + "']").remove();
            }
        })
    })