var?chessBoard=[];
var?me=true;
for?(var?i?=?0;?i?<?15;?i++)?{
chessBoard[i]=[];
for?(var?j?=?0;?j?<?chessBoard.length;?j++)?{
chessBoard[i][j]=0;
};
};
var?chess=document.getElementById('chess');
var?context=chess.getContext('2d');
context.strokeStyle="#bfbfbf";
var?logo=new?Image();
logo.src="images/logo.png";
logo.onload=function(){
context.drawImage(logo,0,0,450,450);
drawChessBoard();
}
var?drawChessBoard=function(){
for?(var?i?=?0;?i?<?15;?i++)?{
context.moveTo(15+i*30,15);
context.lineTo(15+i*30,435);
context.stroke();
context.moveTo(15,15+i*30);
context.lineTo(435,15+i*30);
context.stroke();
};
}
var?oneStep=function(i,j,me){
context.beginPath();
context.arc(15+i*30,15+j*30,13,0,2*Math.PI);
context.closePath();
var?gradient=context.createRadialGradient(15+i*30+2,15+j*30-2,13,15+i*30+2,15+j*30-2,0);
if(me){
gradient.addColorStop(0,"#0a0a0a");
gradient.addColorStop(1,"#636766");
}else{
gradient.addColorStop(0,"#d1d1d1");
gradient.addColorStop(1,"#f9f9f9");
}
context.fillStyle=gradient;
context.fill();
}
chess.onclick=function(e){
var?x=e.offsetX;
var?y=e.offsetY;
var?i=Math.floor(x/30);
var?j=Math.floor(y/30);
if(chessBoard[i][j]==0){
oneStep(i,j,me);
if(me){
chessBoard[i][j]=1;
}else{
chessBoard[i][j]=2;
}
me=!me;
}
}

2016-04-03
再幫你具體分析下吧:你這個for循環(huán)邏輯是:
i=0時,j<chessBoard.length=0;
i=1時,j<chessBoard.length=1;
...
i=15時,j<chessBoard.length=15;
懂了不?
2016-04-03
for?(var?i?=?0;?i?<?15;?i++)?{
????chessBoard[i]=[];
????for?(var?j?=?0;?j?<?chessBoard.length;?j++)?{
????????chessBoard[i][j]=0;
????};
};
這一段有問題,這個決定了你只能在右上半落子?j<15