为什么只能在一半的区域下棋子？

Question

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;
	}
}

Answer 1

我也是按着教程敲的，没什么问题你看看吧var chess = document.getElementById("chess"); var context = chess.getContext('2d'); var me = true; var cheseBoard = []; context.strokeStyle = "#bfbfbf" for (var i = 0; i < 15; i++) {     cheseBoard[i] = [];     for (j = 0; j < 15; j++) {         cheseBoard[i][j] = 0;     } } 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, 50, 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();     context.stroke(); } chess.onclick = function(event) {     var x = event.offsetX;     var y = event.offsetY;     var i = Math.floor(x / 30);     var j = Math.floor(y / 30);     if (cheseBoard[i][j] == 0) {         oneStep(i, j, me);         if (me) {             cheseBoard[i][j] = 1;         } else {             cheseBoard[i][j] = 2;         }         me = !me;     } }