单击2时，使div不可点击

Question

我有一个点击事件触发了一定数量的div（带有类名.sqrBtn）我只需要在给定时间显示所选的两个div。我怎样才能得到其他未被选中的div？

到目前为止我的代码：http://jsbin.com/ucuha3/110/edit

Answer 1

jsFiddle Demo
在定义单击处理程序的任何位置的外部作用域中定义变量，并在每次触发处理程序时将其递增，一旦达到所需的单击次数就移除侦听器。

var bol = 0;

$(".sqrBtn").click(function () {
    bol++;
    if (bol >= 2) {
        $(".sqrBtn").off('click');
    }
});

Answer 2

您可以这样做 - 通过检查所选div的长度

$(".sqrBtn").click(function () {
    var bol = $(".sqrBtn.selected").length < 2;
    // if less less than two selected or current one is selected
    if(bol || $(this).is('.selected')){
      $(this).toggleClass('selected');
    }
});

JSBIN

Answer 3

$(".sqrBtn").click(function () {
    if($(".sqrBtn.clicked").length < 2 && !$(this).hasClass('clicked')){
        $(this).addClass("clicked");
    }
 });

如果单击div，则添加单击的类，如果div的总数为2，则不执行任何操作。