0
重新开始
JavaScript:
$(function() {
//初始化
function reset() {
_start = 0;
_score = 0;
Garr = [[0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0]];
Narr = [2, 4, 8];
addArr = [];
fixarr(5);
}
//多维数组判断是否存在某值
function ifArrVal(arr, value) {
for (var i = 0; i < arr.length; i++) {
for (var x = 0; x < arr[i].length; x++) {
if (arr[i][x] == value) {
addArr.push(i + "," + x)
}
}
}
return;
}
//判断游戏结束
function isGameOver(data) {
for (var r = 0; r < data.length; r++) {
for (var c = 0; c < data[r].length; c++) {
if (data[r][c] == 0) {
return false;
} else if (c < data[r].length - 1 && data[r][c] == data[r][c + 1]) {
return false;
} else if (r < data.length - 1 && data[r][c] == data[r + 1][c]) {
return false;
}
}
}
return true;
}
//更改,添加
function fixarr(x) {
if (_start == 0) {
for (var i = 0; i < x; i++) {
num = parseInt(3 * Math.random());
num2 = parseInt(4 * Math.random());
num3 = parseInt(4 * Math.random());
Garr[num3].splice(num2, 1, Narr[num])
}
_start = 1;
} else {
if (isGameOver(Garr) == true) {
if (confirm("游戏结束, 分数:" + _score + "。 是否重新开始?")) {
history.go(0);
}
} else {
for (var i = 0; i < x; i++) {
addArr = [];
ifArrVal(Garr, 0);
if (addArr.length != 0) {
num = parseInt(3 * Math.random());
num2 = parseInt(addArr.length * Math.random());
var str = addArr[num2];
var arr = str.split(",");
Garr[arr[0]].splice(arr[1], 1, Narr[num])
}
}
}
}
upload();
}
//输出画面
function upload() {
$("#score").html(_score);
$("#game").html("");
for (x in Garr) {
for (y in Garr[x]) {
if (Garr[x][y] == 0) {
$("#game").append("");
} else if (Garr[x][y] == 2) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 4) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 8) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 16) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 32) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 64) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 128) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 256) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 512) {
$("#game").append("" + Garr[x][y] + "");
} else if (Garr[x][y] == 1024) {
$("#game").append("" + Garr[x][y] + "");
}
}
}
};
//键盘事件
$(document).keydown(function(event) {
var e = event || window.event;
var k = e.keyCode || e.which;
switch (k) {
case 37:
for (i = 0; i < 4; i++) {
getData(Garr[i]);
}
break;
case 38:
getData2(Garr);
break;
case 39:
for (i = 0; i < 4; i++) {
getData3(Garr[i]);
}
break;
case 40:
getData4(Garr);
break;
};
fixarr(2); //添加两个数字
upload();
});
//左
var getData = function(arr) {
var i, nextI, len, m;
len = arr.length;
for (i = 0; i < len; i += 1) {
nextI = -1;
for (m = i + 1; m < len; m++) {
if (arr[m] !== 0) {
nextI = m;
break;
}
}
if (nextI !== -1) {
if (arr[i] === 0) {
arr[i] = arr[nextI];
arr[nextI] = 0;
i -= 1;
} else if (arr[i] === arr[nextI]) {
arr[i] = arr[i] * 2;
arr[nextI] = 0;
_score++;
}
}
}
return arr;
};
//右
var getData3 = function(arr) {
var i, nextI, len, m;
len = arr.length - 1;
for (i = len; i > -1; i -= 1) {
nextI = -1;
for (m = i - 1; m > -1; m--) {
if (arr[m] !== 0) {
nextI = m;
break;
}
}
if (nextI !== -1) {
if (arr[i] === 0) {
arr[i] = arr[nextI];
arr[nextI] = 0;
i += 1;
} else if (arr[i] === arr[nextI]) {
arr[i] = arr[i] * 2;
arr[nextI] = 0;
_score++;
}
}
}
return arr;
};
//上
var getData2 = function(arr) {
var i, nextI, len, m, x;
len = arr.length;
for (x = 0; x < len; x += 1) {
for (i = 0; i < len; i++) {
nextI = -1;
for (m = i + 1; m < len; m++) {
if (arr[m][x] !== 0) {
nextI = m;
break;
}
}
if (nextI !== -1) {
if (arr[i][x] === 0) {
arr[i][x] = arr[nextI][x];
arr[nextI][x] = 0;
i -= 1;
} else if (arr[i][x] === arr[nextI][x]) {
arr[i][x] = arr[i][x] * 2;
arr[nextI][x] = 0;
_score++;
}
}
}
}
return arr;
};
//下
var getData4 = function(arr) {
var i, nextI, len, m, x;
len = arr.length - 1;
for (x = len; x > -1; x -= 1) {
for (i = len; i > -1; i--) {
nextI = -1;
for (m = i - 1; m > -1; m--) {
if (arr[m][x] !== 0) {
nextI = m;
break;
}
}
if (nextI !== -1) {
if (arr[i][x] === 0) {
arr[i][x] = arr[nextI][x];
arr[nextI][x] = 0;
i += 1;
} else if (arr[i][x] === arr[nextI][x]) {
arr[i][x] = arr[i][x] * 2;
arr[nextI][x] = 0;
_score++;
}
}
}
}
return arr;
};
//初始化
reset();
});
CSS:
* {
margin: 0;
padding: 0;
}
body {
background: #3E3E3E;
}
#game {
width: 400px;
height: 400px;
margin: 10px auto;
border-left: #EDEDED 1px solid;
border-top: #EDEDED 1px solid;
}
#game span {
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
display: block;
float: left;
font-size: 40px;
color: #666;
border-right: #EDEDED 1px solid;
border-bottom: #EDEDED 1px solid;
box-sizing: border-box;
}
#game span.tile--2 {
background: #FFC43D;
color: #F8FFE5;
}
#game span.tile--4 {
background: #EF476F;
color: #F8FFE5;
}
#game span.tile--8 {
background: #1B9AAA;
color: #F8FFE5;
}
#game span.tile--16 {
background: #06D6A0;
color: #F8FFE5;
}
#game span.tile--32 {
background: #f37694;
color: #F8FFE5;
}
#game span.tile--64 {
background: #22c2d6;
color: #F8FFE5;
}
#game span.tile--128 {
background: #17f8be;
color: #F8FFE5;
}
#game span.tile--256 {
background: #ffd470;
color: #F8FFE5;
}
#game span.tile--512 {
background: #eb184a;
color: #F8FFE5;
}
#game span.tile--1024 {
background: #14727e;
color: #F8FFE5;
}
#game span.tile--2048 {
background: #05a47b;
color: #F8FFE5;
}
#score {
display: block;
margin: 20px auto;
text-align: center;
color: #68868C;
font-size: 80px;
}
#reset {
width: 120px;
height: 50px;
line-height: 50px;
display: block;
margin: 30px auto;
text-align: center;
background: #405559;
color: #fff;
text-decoration: none;
border-radius: 10px;
}