Как мне не разрешить событие выпадения на квадрате, в котором уже есть изображение с использованием javascript?

Question

Как мне не разрешить событие выпадения на квадрате, в котором уже есть изображение с использованием javascript?

0

Вот мой код. Простая игра с 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");
}

user2971494 09 нояб. 2013, в 10:37

Источник

Теги:

javascript

jquery

html

1 ответ

Ещё вопросы

Dr.Molle · Answer 1 · 2013-11-09T08-24-00.000Z

проверьте, имеет ли элемент уже <img/> -descendant:

function drop(ev) {
  if(ev.target.getElementsByTagName('img').length){
    alert('invalid move');return false;
  }
  //continue with your code
}

спасибо за ответ, это работает. Только одна проблема, она работает только после того, как в элементе есть два изображения. Он рассматривает 2 изображения как одно и только потом, отображая «неверный ход»
Я уверен, что мой код не работает, он будет показывать предупреждение, когда найден какой-либо img-элемент, независимо от того, сколько