Vivianluolita 2016-11-01 09:18 采纳率: 0%
浏览 1629
已采纳

点击div如何实现复选框效果?下面代码哪里有错?

  <div class="TabListItem">
        <div class="ListItem">
        <div class="ListItem1">
            <div class="ItemIcon">
                <span class="Icon Icon1"></span>
            </div>
        </div>
        </div>
        <div class="ListItem">
        <div class="ListItem1-2" >
            <div class="ItemIcon">
                <span class="Icon Icon2"></span>
            </div>
        </div>
        </div>
    </div>

            $(document).ready(function(){
        $(".ListItem").click(function(){
            $(".ListItem").eq($(this).index()).find(".ItemIcon").css("border","1px solid #f43530");
          /*  $(".ListItem").find(".ItemIcon").removeClass("SelectedItem");*/
            $(".ListItem").eq($(this).index()).find(".ItemIcon").addClass("SelectedItem");
            if($(".ListItem").eq($(this).index()).find(".SelectedItem").length==1){
                $(".ListItem").eq($(this).index()).find(".ItemIcon").removeClass("SelectedItem");
                $(".ListItem").eq($(this).index()).find(".ItemIcon").css("border","1px solid ##efeff4");
            }
        });
  • 写回答

2条回答 默认 最新

  • Vivianluolita 2016-11-01 11:08
    关注
            $(".ListItem").click(function(){
                    //如果已经被选中
                    if($(this).find(".ItemIcon").hasClass("SelectedItem")){
                        $(this).find(".ItemIcon").removeClass("SelectedItem");
                        $(this).find(".ItemIcon").css("border","1px solid #efeff4");
                    }
                    //如果没被选中
                    else{
                        $(".ListItem").eq($(this).index()).find(".ItemIcon").css("border","1px solid #f43530");
                        $(".ListItem").eq($(this).index()).find(".ItemIcon").addClass("SelectedItem");
                    }
            });
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?