Question

我创建了一个锁，当您单击“777”时会打开，我想将点击次数限制为9.我该怎么做？

var numberOfClicks1 = 0; 
var numberOfClicks2 = 0; 
var numberOfClicks3 = 0;

$('#clickme1').on('click', function() {
    numberOfClicks1++; 
    $('#click-counter1').html(numberOfClicks1);
})
$('#clickme2').on('click', function() {
    numberOfClicks2++;
    $('#click-counter2').html(numberOfClicks2);
})
$('#clickme3').on('click', function() {
    numberOfClicks3++;
    $('#click-counter3').html(numberOfClicks3);
})
$('#down-click1').on('click', function() {
    numberOfClicks1--;
    $('#click-counter1').html(numberOfClicks1);
})
$('#down-click2').on('click', function() {
    numberOfClicks2--;
    $('#click-counter2').html(numberOfClicks2);
})
$('#down-click3').on('click', function() {
    numberOfClicks3--;
    $('#click-counter3').html(numberOfClicks3);
})

Answer 1

var numberOfClicks1 = 0;
var numberOfClicks2 = 0;
var numberOfClicks3 = 0;

$('#clickme1').on('click', function () {
    if (numberOfClicks1 < 9) {
        numberOfClicks1++;
        $('#click-counter1').html(numberOfClicks1);
    }
})
$('#clickme2').on('click', function () {
    if (numberOfClicks2 < 9) {
        numberOfClicks2++;
        $('#click-counter2').html(numberOfClicks2);
    }
})
$('#clickme3').on('click', function () {
    if (numberOfClicks3 < 9) {
        numberOfClicks3++;
        $('#click-counter3').html(numberOfClicks3);
    }
})
$('#down-click1').on('click', function () {
    if (numberOfClicks1 > 0) {
        numberOfClicks1--;
        $('#click-counter1').html(numberOfClicks1);
    }
})
$('#down-click2').on('click', function () {
    if (numberOfClicks2 > 0) {
        numberOfClicks2--;
        $('#click-counter2').html(numberOfClicks2);
    }
})
$('#down-click3').on('click', function () {
    if (numberOfClicks3 > 0) {
        numberOfClicks3--;
        $('#click-counter3').html(numberOfClicks3);
    }
})

似乎我误解了你的问题。编辑后的代码现在将numberOfClicks变量限制在0-9

范围内

Answer 2

如果我猜对了，你有三个显示数字的字段和每个字段的+/-。如果符合条件，您可以退出该功能：

$('#clickme1').on('click', function() {
    if (numberOfClicks1 >= 9) {
        return true;
    }
    numberOfClicks1++; 
    $('#click-counter1').html(numberOfClicks1);
})

Answer 3

你可以使用if（）：

$('#clickme1').on('click', function() {
    if(numberOfClicks1<9){
       numberOfClicks1++; 
       $('#click-counter1').html(numberOfClicks1); 
    } else {
       alert("no more clicks");
    }    
})

防止跌落到0：

$('#down-click1').on('click', function() {
    if(numberOfClicks1<0){
        numberOfClicks1--;
        $('#click-counter1').html(numberOfClicks1);
    }
})

Answer 4

试试这个

$('[id^="clickme"]').on('click', function () {
    var id = $('#click-counter' + this.id.match(/\d+/));
    var num = parseInt(id.text());
    num == 9 ? 9 : num++;
    $(id).text(num);
    var checkLock = $('[id^=click-counter]').map(function () {
        return this.textContent
    });
    if (checkLock[0] == "7" && checkLock[1] == "7" && checkLock[2] == "7") {
        alert("opened");
    }
});

$('[id^="down-click"]').on('click', function () {
    var id = $('#click-counter' + this.id.match(/\d+/));
    var num = parseInt(id.text());
    num == 0 ? 0 : num--;
    $(id).text(num);
    var checkLock = $('[id^=click-counter]').map(function () {
        return this.textContent
    });
    if (checkLock[0] == "7" && checkLock[1] == "7" && checkLock[2] == "7") {
        alert("opened");
    }
});

DEMO

如何将点击次数限制为9？

4 个答案: