スイッチとケースを使用して画像を生成するにはどうすればよいですか？

Question

ここまでは私がこれまで持っていたことです。 newNumberはminとmaxを実行するために作った関数です。私は本当にこれに問題があります。

function onclick() { 
     var num = parseFloat(document.getElementById("do").value); 
     if (num <= 0) { 
      alert("Please enter a bet amount between 1 and 100"); 
     } 
     else if (num > 100) { 
      alert("Please enter a bet amount between 1 and 100"); 
     } 

     var stake = document.getElementById("txtStake").value; 
     if (stake < num) { 
      alert("Wrong number Can't Be Higher Than Stake Number") 
     } 

     var random = newNumber(1, 7); 

     if (random == 1) { 
      document.getElementById("toChangeColor").style.backgroundColor = "red";     
     } 
     else if (random == 2) { 
      document.getElementById("toChangeColor").style.backgroundColor = "green"; 
     } 
     else if (random == 3) { 
      document.getElementById("toChangeColor").style.backgroundColor = "gray"; 
     } 
     else if (random == 4) { 
      document.getElementById("toChangeColor").style.backgroundColor = "yellow"; 
     } 
     else if (random == 5) { 
      document.getElementById("toChangeColor").style.backgroundColor = "brown"; 
     } 
     else if (random == 6) { 
      document.getElementById("toChangeColor").style.backgroundColor = "blue"; 
     } 
     else if (random == 7) { 
      document.getElementById("toChangeColor").style.backgroundColor = "black"; 
     } 

     switch (random) { 
      case 1: 
       document.getElementById("picture").src = "time.jpg"; 
       break; 
      case 2: 
       document.getElementById("picture").src = "pic2.jpg"; 
       break; 
      case 3: 
       document.getElementById("picture").src = "pic3.jpg"; 
       break; 
      case 4: 
       document.getElementById("picture").src = "pic4.jpg"; 
       break; 
      case 5: 
       document.getElementById("picture").src = "pic5.jpg"; 
       break; 
      case 6: 
       document.getElementById("picture").src = "pic6.jpg"; 
       break; 
      case 7: 
       document.getElementById("picture").src = "pic7.jpg"; 
       break; 
     } 
    } 

ボタンをクリックすると、特定の領域に表示する5つの選択肢の中からランダムな画像が必要になります。スイッチやループを使用してこれを行うにはどうすればよいですか？

Answer 1

状況を書き換えたり、大文字と小文字が重複する場合は、配列または2次元配列を作成する方が良いでしょう。

var bgColors = ['red', 'green', 'yelow']; 
var pics = ['time.jpg', 'pic2.jpg', 'pic3.jpg']; 

var randomIndex = newNumber(0, 2); 

document.getElementById("toChangeColor").style.backgroundColor = bgColors[randomIndex]; 
document.getElementById("picture").src = pics[randomIndex];