Вот мой код. Простая игра с tic-tac-toe. Все работает отлично, я просто не могу понять, как не допускать сброса более одного изображения на один div. Я бы очень хотел, чтобы кто-нибудь мог помочь мне с любыми предложениями относительно того, как это реализовать.
Благодаря :)
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("Text", ev.target.id);
}
function drop(ev) {
var data = ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
ev.preventDefault();
if (data == "dog1" || data == "dog2" || data == "dog3" || data == "dog4" || data == "dog5") {
ev.target.style.backgroundColor = 'red';
ev.target.setAttribute("selected", "dog");
}
else if(data == "dragon1" || data == "dragon2" || data == "dragon3" || data == "dragon4" || data == "dragon5") {
ev.target.style.backgroundColor = 'green';
ev.target.setAttribute("selected", "dragon");
}
var array = new Array(
document.getElementById("square1").getAttribute("selected"),
document.getElementById("square2").getAttribute("selected"),
document.getElementById("square3").getAttribute("selected"),
document.getElementById("square4").getAttribute("selected"),
document.getElementById("square5").getAttribute("selected"),
document.getElementById("square6").getAttribute("selected"),
document.getElementById("square7").getAttribute("selected"),
document.getElementById("square8").getAttribute("selected"),
document.getElementById("square9").getAttribute("selected"));
if (array[0] == "dog" && array[1] == "dog" && array[2] == "dog")
alert("dog Wins!");
else if (array[0] == "dragon" && array[1] == "dragon" && array[2] == "dragon")
alert("dragon Wins");
else if (array[3] == "dog" && array[4] == "dog" && array[5] == "dog")
alert("dog Wins!");
else if (array[3] == "dragon" && array[4] == "dragon" && array[5] == "dragon")
alert("dragon Wins");
else if (array[6] == "dog" && array[7] == "dog" && array[8] == "dog")
alert("dog Wins!");
else if (array[6] == "dragon" && array[7] == "dragon" && array[8] == "dragon")
alert("dragon Wins");
else if (array[0] == "dog" && array[3] == "dog" && array[6] == "dog")
alert("dog Wins!");
else if (array[0] == "dragon" && array[3] == "dragon" && array[6] == "dragon")
alert("dragon Wins");
else if (array[2] == "dog" && array[5] == "dog" && array[8] == "dog")
alert("dog Wins!");
else if (array[2] == "dragon" && array[5] == "dragon" && array[8] == "dragon")
alert("dragon Wins");
else if (array[6] == "dog" && array[4] == "dog" && array[2] == "dog")
alert("dog Wins!");
else if (array[6] == "dragon" && array[4] == "dragon" && array[2] == "dragon")
alert("dragon Wins");
else if (array[0] == "dog" && array[4] == "dog" && array[8] == "dog")
alert("dog Wins!");
else if (array[0] == "dragon" && array[4] == "dragon" && array[8] == "dragon")
alert("dragon Wins");
else if (array[1] == "dog" && array[4] == "dog" && array[7] == "dog")
alert("dog Wins!");
else if (array[1] == "dragon" && array[4] == "dragon" && array[7] == "dragon")
alert("dragon Wins");
}
проверьте, имеет ли элемент уже <img/>
-descendant:
function drop(ev) {
if(ev.target.getElementsByTagName('img').length){
alert('invalid move');return false;
}
//continue with your code
}