I have two divs, one (div2) that contains 4 images that will be dragged to another div (div1) that has a still image. My need is to play the ID values of each image within an array called Response in drop order, ie: If the ID 7 image was placed in the first div, this will be the first number in the array and so on. I've been hooked for 3 hours and I need help. Follow the code >
<body>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
<img src="bloco0.png">
</div>
<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)">
<image id="5" class = "bloco" src="bloco1.png" draggable="true" ondragstart="drag(event)">
<image id="6" class = "bloco" src="bloco2.png" draggable="true" ondragstart="drag(event)">
<image id="7" class = "bloco" src="bloco3.png" draggable="true" ondragstart="drag(event)">
<image id="8" class = "bloco" src="bloco4.png" draggable="true" ondragstart="drag(event)">
</div><br>
<button onclick="check()"> verificar </button>
<script type="text/javascript" src="js/main.js"></script>
<script>
var resposta = [];
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
if(ev.target.tagName == "IMG"){
ev.target.parentNode.appendChild(document.getElementById(data));
}else{
ev.target.appendChild(document.getElementById(data));
}
}
var el1 = document.getElementById('5');//\
var el2 = document.getElementById('6');//\
var el3 = document.getElementById('7');//\
var el4 = document.getElementById('8');//\
function check(){
if(el1.parentElement.id == "div1" && el2.parentElement.id == "div2" && el3.parentElement.id == "div2" && el4.parentElement.id == "div2"){
resposta.push("5");
console.log(resposta);
}
if(el2.parentElement.id == "div1" && el3.parentElement.id == "div2" && el4.parentElement.id == "div2"){
resposta.push("4");
if(el1.parentElement.id=="div1" && resposta[0]!="5"){
resposta.push("5");
}
console.log(resposta);
}
}
</script>
The function "check ()" is an attempt I made and did not work. Thanks in advance.