2017-11-13 9 views
0

私は掃海艇ゲームを構築しようとしています。私はすべてのバックエンドコードを持っていると思う、鳥を作成し、鉱山などを取得する掃除機グリッドをクリック可能にする方法

しかし、私は今グリッドをクリック可能にする方法がわからないという問題があります。

誰でも私を助けることができますか?これは私の最初のJavaScriptプロジェクトです。私はとても混乱しています。ありがとうございました。ここで

$(document).ready(function() { 
    $("#create").click(createMinefield); 
    $("#clear").click(reset); 
}); 

var reset = function(){ 
    var minefield=$('#minefield'); 
    minefield.empty(); 
} 

var createMinefield = function(){ 
    var rows=$('#rows').val(); 
    var columns=$('#columns').val(); 
    var mines=$('#mines').val(); 
    var minefield=$('#minefield'); 
    minefield.empty(); 

    if(rows > 30) { 
     rows=30; 
     alert("The number of rows should less than or equal to 30") 
    } 
    if(rows < 8) { 
     rows=8; 
     alert("The number of rows should greater than or equal to 8") 
    } 
    if(columns>40){ 
     columns=40; 
     alert("The number of columns should less than or equal to 40") 
    } 
    if(columns<8){ 
     columns=8; 
     alert("The number of columns should greater than or equal to 8") 
    } 

    if(mines<1){ 
     mines=1; 
     alert("The number of mines should greater than or equal to 1") 
    } 

    if(mines>(rows*columns)-1){ 
     mines=rows*columns-1; 
     alert("The number of mines should less than or equal to the size of grid minus one") 
    } 


    for(var y=0; y<rows;y++){ 
     var currentRow="<tr>" 
     for(var x=0;x<columns;x++){ 
      currentRow+="<td><button></button></td>" 
     } 
     currentRow+="</tr>" 
     minefield.append(currentRow); 
    } 



    var arr=new Array(); 
    var min=1; 
    var max= (rows * columns)-1; 
    var minesNum= mines; 
    console.log("numMine:",minesNum); 

    // set 2d array 
    for(var i=0; i<rows;i++){ 
     arr[i]=new Array() 
     for(var j=0;j<columns;j++){ 
      arr[i][j]=0; 
     } 
    } 


    for (var i=0; i<minesNum; i++){ 
     var x = Math.floor(Math.random()*rows); 
     var y = Math.floor(Math.random()*columns); 
     if(arr[x][y]==-1){ 
      i--; 
      continue; 
     } 
     console.log("i",i); 
     arr[x][y]=-1; 
    } 

私はここで私の隣人に

 for(var i=0;i<rows;i++){ 
     for(var j=0;j<columns;j++){ 
      if(arr[i][j]==-1){  
       continue; 
      } 
      if((i-1)>=0 && arr[i-1][j]==-1){ //left 
       arr[i][j]=arr[i][j]+1; 
      } 

      if((j-1) >=0 && arr[i][j-1]==-1){ //down 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(i+1<rows && arr[i+1][j]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(j+1<columns && arr[i][j+1]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(i+1<rows && j+1<rows && arr[i+1][j+1]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(i-1>=0 && j-1 >=0 && arr[i-1][j-1]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(i-1>=0 && j+1<rows && arr[i-1][j+1]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 
      if(i+1<rows && j-1>=0 && arr[i+1][j-1]==-1){ 
       arr[i][j]=arr[i][j]+1; 
      } 

     } 
    } 
    console.log("arr",arr); 

} 

を確認ここで<button>間のタグの私のHTMLコード

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title>MineSweeper</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
     <script src="MinePlay.js"></script> 
     <link rel="stylesheet" type="text/css" href="minesweepercss.css"> 
    </head> 

    <body> 
     Rows: <input id="rows" type="number" value="8" min="8" max="30" name="fname"><br> 
     Columns: <input id="columns" type="number" value="8" min="8" max="40" name="lname"><br> 
     Mines: <input id="mines" type="number" value="1" name="mines" ><br> 
     <button id="create"> Create!</button> 
     <button id="clear"> Restart!</button> 

     <table> 
      <tbody id="minefield"></tbody> 
     </table>  
    </body> 

</html> 

答えて

0
for(var y=0; y<rows;y++){ 
    var currentRow="<tr>" 
    for(var x=0;x<columns;x++){ 
     currentRow+="<td><button></button></td>" 
    } 
    currentRow+="</tr>" 
    minefield.append(currentRow); 
} 

は次のようにそこに何かを入れて -

<button type="button" onclick="alert('Hello world!')">Click Me!</button> 
+0

動作しません。私もHTMLコードを追加しました。どうぞご覧ください。ありがとうございました。 – user6428015

+0

このエラーを確認できますか? 'MinePlay.js:6 Uncaught SyntaxError:missing)引数リストの後に行6 –

+0

私はこのエラーを受け取りました:" Minesweeper.html:2 Uncaught SyntaxError:予期しないトークン} "。あなたのエラーと私のエラーの両方をチェックしましたが、間違っているとは見えませんでした。両方とも正しいです。 – user6428015

関連する問題