Последовательность блоков после загрузки изображения

Question

Так что я пытаюсь создать логику всплывающих окон для простой находки игровой игры. Поэтому я создал массив строк, которые я хочу отобразить 2 сообщения оповещения. Первое предупреждение о том, что вы нашли [insertName]. Затем, если вы снова нажмете на один и тот же объект, вы увидите общее сообщение «вы уже нашли это». Затем, после того, как все изображения были нажаты, у меня есть новая страница, загруженная на основе количества объектов, которые были нажаты. У меня возникли проблемы с тем, как выполнить это первое начальное предупреждение. Я думал, что создаю еще один массив для начальных предупреждений, но это когда я застрял.

<div id="b1" class="mybox">One</div> 
<div id="b2" class="mybox">Two </div> 
<div id="b3" class="mybox">Three </div> 
<div id="b4" class="mybox">Four </div> 
<div id="b5" class="mybox">Effortless Calls </div> 
<div id="b6" class="mybox">Voicebot </div> 

<script type="text/javascript"> 

    //$('body').css('background','blue'); 
    var Boxes = []; 
    var ttle = $('.mybox').length; 
    $('.mybox').click(function() { 

    alert('Blah '); 
    var bx = this.id; 
    if (Boxes.indexOf(bx) >= 0){ 
     alert('You Already Found Object '); 
    }else{ 
     Boxes.push(bx); 
    } 

    if (Boxes.length ==ttle) 
     window.location = "#/finishedgame"; 
    }); 
</script> 

Answer 1

Вам не нужен еще один массив, прежде чем делать Boxes.push(bx); почему вы не просто делать alert(hey you found [insertName]);? это должен быть первый раз, когда пользователь прикасается к коробке, когда вы хотите получить первое предупреждение, по крайней мере, из того, что я собрал с вашего поста. Так

var Boxes = []; 
var ttle = $('.mybox').length; 
$('.mybox').click(function() { 

    var bx = this.id; 
    if (Boxes.indexOf(bx) >= 0){ 
     alert('You Already Found Object '); 
    }else{ 
     var text = [get name of box here] 
     alert("hey you found" + text); 
     Boxes.push(bx); 
    } 

    if (Boxes.length ==ttle) 
     window.location = "#/finishedgame"; 
}); 

Answer 2

Добавить пользовательский атрибут для ваших элементов данных щелкнул = «ложь»
Когда пользователь нажимает на элемент набора elem.setAttribute («данные щелкнул», «правда»);

<div id="b1" class="mybox" data-clicked="false">One</div> 
<div id="b2" class="mybox" data-clicked="false">Two </div> 
<div id="b3" class="mybox" data-clicked="false">Three </div> 
<div id="b4" class="mybox" data-clicked="false">Four </div> 
<div id="b5" class="mybox" data-clicked="false">Effortless Calls </div> 
<div id="b6" class="mybox" data-clicked="false">Voicebot </div> 

$('.mybox').click(function (elem) { 
    var clicked = $(elem).data('clicked'); 

    if(clicked){ 
     alert(msg1); 
    } else { 
     alert(msg1); 
     elem.setAttribute('data-clicked','true'); 
    }; 

});