Javascript 单击计数器达到0时将类添加到div

现在，当您在div内单击时，计数器将减少1。我如何让它停在0？ 当它达到0时，如何添加类

我希望在单击计数器达到0时启用覆盖。 如果有更好的方法在单击达到0后禁用div box1。我们可以这样试试

$( function() {
   $('.box').click( function() {
     var num = $(this).find('.num');
     num.text( parseInt(num.text()) - 1 );
   });
});

这应该可以做到：

$('.box').click( function() {
    var num = $(this).find('.num');
    val = parseInt(num.text()) - 1;
    if (val > 0){
        num.text(val - 1);
    } else {
        $(".overlay").show();
        // add your class here.
    }
    num.text( val );
});

这应该可以做到：

$('.box').click( function() {
    var num = $(this).find('.num');
    val = parseInt(num.text()) - 1;
    if (val > 0){
        num.text(val - 1);
    } else {
        $(".overlay").show();
        // add your class here.
    }
    num.text( val );
});

---

我不会在每次单击时搜索DOM并解析HTML，而是缓存元素及其值：

var $box = $('#box1'),
    $num = $box.find('.num'),
    limit = $num.text();

$box.click(function() {
    $num.text(--limit);
    if (limit === 0) {
        $('.overlay').show();
    }
});

---

.

与其每次单击都搜索DOM并解析HTML，不如缓存元素及其值：

var $box = $('#box1'),
    $num = $box.find('.num'),
    limit = $num.text();

$box.click(function() {
    $num.text(--limit);
    if (limit === 0) {
        $('.overlay').show();
    }
});