我制作了一個 javascript 代碼，將我的圖像從數組隨機顯示到照片網格中，但我不希望圖像重復

Question

好的，所以我使用 javascript 使用數組在我的網格中隨機顯示圖像，我遇到的問題是，由於它有時會抓取隨機圖像，因此它會兩次抓取相同的圖像。 我將在下面發布我的代碼，但我只是在尋找解決方案，以便一旦顯示圖像就不會再次顯示該圖像

這是我的javascript：

    var random_images_array = ['atoodbranding2.png', 'thebegining.jpg', 'ella_playin_in_the_yard.png', 'project-1.png','Frontier-attachments-for-sale.png','ipfwadd-01.jpg','invites.png'];

function getRandomImage(imgAr, path) {
    path = path || 'images/portfolio/'; // default path here
    var num = Math.floor( Math.random() * imgAr.length );
    var img = imgAr[ num ];
    var imgStr = '<img src="' + path + img + '" alt = "">';
    document.write(imgStr); document.close();
}

這是我的 html

<div class="container photo-container bg-3 text-center">


      <div class="photos">
      <a data-toggle="modal" id="1" href="#myModal"><script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="2" href="#myModal"><script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="3" href="#myModal"><script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="4" href="#myModal"><script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="5" href="#myModal"> <script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="6" href="#myModal"> <script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
      <a data-toggle="modal" id="7" href="#myModal"><script type="text/javascript">getRandomImage(random_images_array, 'images/portfolio/')</script></a>
</div>
</div>

我對 javascript 還很陌生，如果這是一個已經回答的問題或者一個超級簡單的解決方法，我很抱歉

Answer 1

您可以將所選圖像從數組中拼接出來，然后在下一次迭代中將不可用：

function getRandomImage(imgAr, path) {
    path = path || 'images/portfolio/'; // default path here
    var num = Math.floor( Math.random() * imgAr.length );
    var img = imgAr[ num ];
    // remove the selected image
    imgAr.splice(num, 1);
    var imgStr = '<img src="' + path + img + '" alt = "">';
    document.write(imgStr); document.close();
}