Código JavaScript verificar divs já clicadas
Um cara pediu no fórum imasters, era rapidinho, ai fiz um exemplo.
Ao clicar em cada div, ela vai ganhando uma class de “ativa”.
Ao selecionar todas as 3, aparece uma mensagem abaixo de todas.
É possível fazer a volta, e fazer desselecionar, mas deixo para vcs comentarem aqui, caso alguém peça eu implemento também.
<style>
.click-me {
width: 100px; height: 100px;
margin: 10px;
border: 1px solid #000;
float: left;
}
.is-active { border: 1px solid #f00; }
#result {
border: 1px solid #000;
display: none;
clear: both;
padding: 40px;
}
</style>
<script>
(function(){
var count = 0;
var clickMe = function(){
this.className = 'click-me is-active';
count += 1;
verifyDivs();
}
var verifyDivs = function(){
if( count===3 ){
document.getElementById('result').style.display = 'block';
}
}
window.onload = function(){
var divs = document.getElementsByClassName('click-me');
for( var i=0; i<divs.length; i++ ){
divs[i].onclick = clickMe;
}
}
})();
</script>
<div class="click-me"></div>
<div class="click-me"></div>
<div class="click-me"></div>
<div id="result">Resultado</div>