2016-12-08 4 views
0

このコードの目的は、ランダムな数値セットと関連するフレーム番号を取得してローカルストレージに渡し、検索時にそれらを別の「フレーム番号」の場所ボックスリスト形式でローカルストレージ変数を設定および取得しようとしています

function myFunction() { 
 
       var x = Math.floor((Math.random() * 10) + 1); 
 
       document.getElementById("Pins").innerHTML = x; 
 
      } 
 
      var clicks = 0; 
 
      function onClick() { 
 
       clicks += 1; 
 
       if (clicks > 10) { 
 
        clicks = 0; 
 
       } 
 
       document.getElementById("clicks").innerHTML = clicks; 
 
      }; 
 
      if (typeof (Storage) !== "undefined") { 
 
       if (('#clicks') == 1) { 
 
        (localStorage.setItem("#frame1", "#clicks")) 
 
        document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1"); 
 
       } 
 
      } 
 
      else if (('#clicks') == 2) { 
 
       (localStorage.setItem("#frame2", "#clicks")) 
 
       document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2"); 
 
      }
.framebox { 
 
    border: 1px dashed black; 
 
}
 
 
     <button onclick="myFunction(), onClick()">Roll</button> 
 
     <div class="row"> 
 
      <div class="col-xs-12"> 
 
       Pins Hit: 
 
      </div> 
 
      <p id="Pins"></p> 
 
      <div class="col-xs-12"> Frame Number</div> 
 
      <div id="clicks"></div> 
 
      <br /> 
 
      <h5 class="text-center">Frames</h5> 
 
      <ul> 
 
       <li class="framebox col-xs-1" id="frame1" name="Frame 1"></li> 
 
       <li class="framebox col-xs-1" id="frame2" name="Frame 2"></li> 
 
       <li class="framebox col-xs-1" id="frame3" name="Frame 3"></li> 
 
       <li class="framebox col-xs-1" id="frame4" name="Frame 4"></li> 
 
       <li class="framebox col-xs-1" id="frame5" name="Frame 5"></li> 
 
       <li class="framebox col-xs-1" id="frame6" name="Frame 6"></li> 
 
       <li class="framebox col-xs-1" id="frame7" name="Frame 7"></li> 
 
       <li class="framebox col-xs-1" id="frame8" name="Frame 8"></li> 
 
       <li class="framebox col-xs-1" id="frame9" name="Frame 9"></li> 
 
       <li class="framebox col-xs-1" id="frame10" name="Frame 10"></li> 
 
      </ul> 
 
     </div> 
 
     
 
    
 

私は正しい数とスコアを返すために、フレームを得ることができない、すべてのヘルプは高く評価され

+1

これは、 'if(( '#clicks')== 1)'という文字列を '#clicks''を数字' 1'と比較しますが、もちろんそれらは決して等しくはありません。変数 'clicks'を比較するために' if(clicks == 1) 'と言っていますか? – nnnnnn

+0

@nnnnnnこれは理にかなっています。ここでは、 "#clicks"の現在のカウントを比較して数字が一致するかどうかを確認し、それに基づいてフレームスコアを設定します。何かご意見は? – Joshua

+0

現在、文字列 '" #clicks "がある場合は、代わりに変数' clicks'を使用してください。あなたが 'if(clicks> 10)'で既に行ったことに似ています。 – nnnnnn

答えて

1
<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
</head> 
<body> 
    <style> 
     .framebox { 
      border: 1px dashed black; 
     } 
    </style> 


    <button onclick="myFunction();onClick()">Roll</button> 
    <div class="row"> 
     <div class="col-xs-12"> 
      Pins Hit: 
     </div> 
     <p id="Pins"></p> 
     <div class="col-xs-12"> Frame Number</div> 
     <div id="clicks"></div> 
     <br /> 
     <h5 class="text-center">Frames</h5> 
     <ul> 
      <li class="framebox col-xs-1" id="frame1" name="Frame 1"></li> 
      <li class="framebox col-xs-1" id="frame2" name="Frame 2"></li> 
      <li class="framebox col-xs-1" id="frame3" name="Frame 3"></li> 
      <li class="framebox col-xs-1" id="frame4" name="Frame 4"></li> 
      <li class="framebox col-xs-1" id="frame5" name="Frame 5"></li> 
      <li class="framebox col-xs-1" id="frame6" name="Frame 6"></li> 
      <li class="framebox col-xs-1" id="frame7" name="Frame 7"></li> 
      <li class="framebox col-xs-1" id="frame8" name="Frame 8"></li> 
      <li class="framebox col-xs-1" id="frame9" name="Frame 9"></li> 
      <li class="framebox col-xs-1" id="frame10" name="Frame 10"></li> 
     </ul> 
    </div> 






    <script> 

     function myFunction() { 
      var x = Math.floor((Math.random() * 10) + 1); 
      document.getElementById("Pins").innerHTML = x; 
     } 
     var clicks = 0; 
     function onClick() { 
      clicks += 1; 
      if (clicks > 10) { 
       clicks = 0; 
      } 
      document.getElementById("clicks").innerHTML = clicks; 

     if (typeof (Storage) !== "undefined") { 
      if ((clicks) == 1) { 
       (localStorage.setItem("#frame1", clicks)) 
       document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1"); 
      } 

     else if (clicks == 2) { 
      (localStorage.setItem("#frame2", clicks)) 
      document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2"); 
     } 
     } 
     } 
    </script> 
</body> 
</html> 

上記のコードを試してみてください

+0

あなたはあなたが変更したものを見るためにラインごとに比較することになっていますか? – nnnnnn

+0

問題のコードは機能ブロック外であり、多くの構文エラーがあります。 – kva

+0

1

あなたが設定されているとのgettin Gストリング#clicksの代わりに、クリック数、コードの変更、代わりにあなたがクリック変数格納し、あまりにも比較のために同じを使用する必要があります文字列#clicksを格納する

if (typeof (Storage) !== "undefined") { 
     if (clicks == 1) { 
      localStorage.setItem("#frame1", clicks); 
      document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1"); 
     } 
    } 
    else if (clicks == 2) { 
     localStorage.setItem("#frame2", clicks); 
     document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2"); 
    } 

はEDIT:あなたは、それが続くとコンソールでクリック数を見るように1や2は、他のブロックを入れ等しいでもないので、クリック数を見ることができません

if (typeof (Storage) !== "undefined") { 
     if (clicks == 1) { 
      localStorage.setItem("#frame1", clicks); 
      document.getElementById("frame1").innerHTML = localStorage.getItem("#frame1"); 
     } 
    } 
    else if (clicks == 2) { 
     localStorage.setItem("#frame2", clicks); 
     document.getElementById("frame2").innerHTML = localStorage.getItem("#frame2"); 
    } 
else{ 
    console.log(clicks); 
} 
+0

あなたの答えはありがとうございます、残念ながら、それは検索のために正しく動作していないようです。 – Joshua

+0

その場合、クリック数は1または2ではありません。もう1つのelse文を追加して、クリック数を表示します。私は答えを更新します –

関連する問題