if“ x＆quot”位于7x9网格中，然后发表“ y y”

Question

因此，我有一个7x9网格，每个盒子里的每个盒子都从阵列中挑出随机图片。现在，我想“扫描”网格喜欢：如果“ picture1”已经在7x9网格中，然后从图片4,5,6中选择 - 如果不使用Picture1。

这就是我到目前为止得到的。

let randomPic = ["../img/map1.jpg", "../img/map4.jpg", "../img/map5.jpg", "../img/map6.jpg"];
// map6 wird zu map2 wenn eingenommen
// map4 und map5 wird zu map3 wenn eingenommen
// map1 darf nur alle 7 felder 1mal vorkommen


let divs = document.querySelectorAll("div.box");
let divArray = Array.prototype.slice.call(divs);

divArray.forEach(function(div) {
  let randomNum = Math.floor(Math.random() * randomPic.length);
  div.style.backgroundImage = "url(" + randomPic[randomNum] + ")";
});

.container {
  display: inline-block;
  justify-content: center;
  display: flex;
}

.map {
  display: grid;
  grid-template-columns: repeat(7, 59px);
  grid-template-rows: repeat(9);
  grid-gap: 2px;
  background: rgb(53, 31, 3);
  border: 3px solid rgb(53, 31, 3);
  position: relative;
  top: 50px;
}

.box {
  width: 58px;
  height: 42px;
}

<div class="container">
  <!-- 7x9 map -->
  <div class="map">
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
    <div class="box" id=""></div>
  </div>
</div>

我希望我能解释我的意思足够好。

thnxs。

Answer 1

这应该去：

let randomPic = ["../img/map1.jpg", "../img/map4.jpg", "../img/map5.jpg", "../img/map6.jpg"];
// map6 wird zu map2 wenn eingenommen
// map4 und map5 wird zu map3 wenn eingenommen
// map1 darf nur alle 7 felder 1mal vorkommen

let divs = document.querySelectorAll("div.box");
let divArray = Array.prototype.slice.call(divs);

let imgSelected = false;

divArray.forEach(function(div) {
    if(!imgSelected) {
      let randomNum = Math.floor(Math.random() * randomPic.length);
      div.style.backgroundImage = "url(" + randomPic[randomNum] + ")";
      if (randomNum === 0) imgSelected = true; 
    } else {
      let filteredArray = randomPic.slice(1);
      let randomNum = Math.floor(Math.random() * filteredArray.length);
      div.style.backgroundImage = "url(" + filteredArray[randomNum] + ")";
    }
  });