Как получить изображение во всплывающем окне из игры на память - PullRequest
0 голосов
/ 31 марта 2020

Я использовал приведенный ниже скрипт для запуска игры на память с изображениями. Игра работает отлично. Но я попытался отобразить изображение во всплывающем окне, как только совпадение найдено в игре. но всплывающее окно не показывает изображение на нем, а только имя изображения на панели ссылок.

скрипт пробуется

for (i = 0; i < buttons.length; i++) {
buttons[i].addEventListener('click', function (e) {
var turnable = e.target.dataset.turnable;


//first click
if (!wait && lastKnownButtonId == undefined && lastKnownButtonNumber == undefined && turnable == 'true') {
  e.target.dataset.turnable = 'false';

  e.target.innerHTML = getgImage(event.target.dataset.number);
  e.target.style.backgroundColor = 'yellow';

  lastKnownButtonId = e.target.id;
  lastKnownButtonNumber = e.target.dataset.number;

}
//second click
else if (!wait && lastKnownButtonId != undefined && lastKnownButtonNumber != undefined && turnable == 'true' && e.target.id != lastKnownButtonId) {
  e.target.dataset.turnable = 'false';

  e.target.innerHTML = getgImage(event.target.dataset.number);




  //match
  if (e.target.dataset.number == lastKnownButtonNumber) {
    e.target.style.backgroundColor = '#00FF7F';
    document.getElementById(lastKnownButtonId).style.backgroundColor = '#00FF7F';

    getpicture();

    lastKnownButtonId = undefined;
    lastKnownButtonNumber = undefined;


    matches++;


    if (matches == 8) {

    showWinScreen();
    //clearTimeout(timeoutHandle);

    document.getElementById("finalMove").innerHTML = moves;


    }

  }

  //no match
  else {
    document.getElementById(lastKnownButtonId).style.backgroundColor = 'red';
    e.target.style.backgroundColor = 'red';
    wait = true;

    setTimeout(() => {
      e.target.dataset.turnable = 'true';
      e.target.style.backgroundColor = 'white'
      e.target.innerHTML = getgImage(0);


      var tempLastClickedButton = document.getElementById(lastKnownButtonId);

      tempLastClickedButton.dataset.turnable = 'true';
      tempLastClickedButton.style.backgroundColor = 'white';
      tempLastClickedButton.innerHTML = getgImage(0);

      lastKnownButtonId = undefined;
      lastKnownButtonNumber = undefined;
      wait = false;
    }, 1000);


  }
  }

  });
  }

вышеприведенный скрипт для памяти где он проверяет совпадение изображений. скрипт пытается отобразить изображение на всплывающем экране, вызывается с помощью функции getpicture () под условием совпадения

 function getpicture(){
   var pic= document.getElementById('canvas');
   pic.style.display = 'block';
   pic.style.width=200+"px";
   pic.style.height=200+"px";
   pic.innerHTML= getgImage(event.target.dataset.number);
   url=pic.innerHTML;
   window.open(url,"pic",'width=pic.stylewidth,height=pic.style.height,resizable=1');
 }

, когда я запускаю этот код, когда сопоставление выполнено, появляется всплывающее окно, но изображение не отображается, но в строке ссылок отображается имя изображения, например: http://localhost/PROJECT/%3Cimg%20src=%22Annotated%20Dataset / images / MAN_SHOW_FW183.jpg% 22% 3E

Я думаю, что функция Я пытался отобразить изображение на всплывающем окне неправильно, Может кто-нибудь помочь мне с этой проблемой.

Спасибо

...