单击第二次单击后删除添加的类

Question

How to remove priSCW-active after second click.

The code needs work but when i click second time on the container it is not closing.

What i am missing here anyone can help me in this regard ?

DEMO

$(document).ready(function() {
   $("body").on("click", ".container", function(event) {
      event.stopPropagation();
      var ID = $(this).attr("id");
      $(".priSCWrap").removeClass("priSCW-active");
      $("#open" + ID).toggleClass("priSCW-active").siblings().removeClass('priSCW-active');;
   });
   $("body").click(function(){
         $(".priSCWrap").removeClass("priSCW-active");
    });
});

Answer 1

$(document).ready(function() {
   var clicked = 0;
   $("body").on("click", ".container", function(event) {
      if (++clicked === 2) {
          // your code
      }
      event.stopPropagation();
      var ID = $(this).attr("id");
      $(".priSCWrap").removeClass("priSCW-active");
      $("#open" + ID).toggleClass("priSCW-active").siblings().removeClass('priSCW-active');
   });
   $("body").click(function(){
         $(".priSCWrap").removeClass("priSCW-active");
    });
});

Answer 2

If you remove the removeClass() call, then the toggle will achieve what you need for you. At the moment you remove the class and toggle will then always immediately add it back on again. Also note that the .priSCWrap elements are not siblings, so siblings() won't select anything. You need to query those elements again and remove the current from the matched set, to remove any existing priSCWrap-active classes. Try this:

$("body").on("click", ".container", function(event) {
    event.stopPropagation();
    var $current = $(this).find('.priSCWrap').toggleClass("priSCW-active");
    $('.priSCWrap').not($current).removeClass('priSCW-active');
});

Example fiddle

Also note the use of this and find() which negates the need to bodge together an id selector.

Answer 3

您必须删除此行

$(".priSCWrap").removeClass("priSCW-active");