我正在开发一款Reversi(奥赛罗)游戏,我面临着一个场景,我要检测棋盘上的空位。我写的,但不准确。
var IsUserTurn = true;
var Empty;
function InsertBlack(x, y) {
var Temp1 = document.createElement("img");
Temp1.setAttribute("src", "http://www.uploadhosting.co/uploads/151.238.149.6/Black.png");
Temp1.style.position = "absolute";
var Temp3 = (x * 50) - 50;
var Temp4 = (y * 50) - 50;
Temp1.style.left = Temp3 + "px";
Temp1.style.top = Temp4 + "px";
var Temp2 = document.getElementById("panel");
Temp2.style.position = "relative";
Temp2.appendChild(Temp1);
}
function InsertWhite(x, y) {
var Temp1 = document.createElement("img");
Temp1.setAttribute("src", "http://www.uploadhosting.co/uploads/151.238.149.6/White.png");
Temp1.style.position = "absolute";
var Temp3 = (x * 50) - 50;
var Temp4 = (y * 50) - 50;
Temp1.style.left = Temp3 + "px";
Temp1.style.top = Temp4 + "px";
var Temp2 = document.getElementById("panel");
Temp2.style.position = "relative";
Temp2.appendChild(Temp1);
}
function SetClickEventListenerForPanel() {
var Temp1 = document.getElementById("panel");
if (Temp1.addEventListener) {
Temp1.addEventListener("click", PanelClickProcessor);
} else if (Temp1.attachEvent) {
Temp1.attachEvent("onclick", PanelClickProcessor);
}
}
function SetBooleanVariableStatus() {
if (IsUserTurn === true) {
document.getElementById("Boolean").innerHTML = "User's turn";
} else {
document.getElementById("Boolean").innerHTML = "Computer's turn";
}
}
function IsEmpty(x, y) {
var Temp1 = document.getElementsByTagName("img");
var i;
var xx, yy;
xx = (x * 50) - 50 + ("px");
yy = (y * 50) - 50 + ("px");
for (i = 0; i < Temp1.length; i++) {
if (Temp1[i].style.left != xx && Temp1[i].style.top != yy) {
Empty = true;
} else {
Empty = false;
break;
}
}
return Empty;
}
function Convert(data) {
if (data <= 50) {
return 1;
}
if (data <= 100) {
return 2;
}
if (data <= 150) {
return 3;
}
if (data <= 200) {
return 4;
}
if (data <= 250) {
return 5;
}
if (data <= 300) {
return 6;
}
if (data <= 350) {
return 7;
}
if (data <= 400) {
return 8;
}
}
function PanelClickProcessor(e) {
var X = e.pageX - this.offsetLeft;
var Y = e.pageY - this.offsetTop;
var xtocall, ytocall;
xtocall = Convert(X);
ytocall = Convert(Y);
alert(IsEmpty(xtocall, ytocall));
}
InsertBlack(4, 4);
InsertWhite(5, 4);
InsertWhite(4, 5);
InsertBlack(5, 5);
SetClickEventListenerForPanel();
SetBooleanVariableStatus();
演示:http://jsfiddle.net/huL3qoa3
当你点击板上的任何位置时,如果位置是否为空,都会显示一条警告。它工作不好,出了什么问题?
在比较坐标时,应使用||
运算符而不是&&
运算符:
if (Temp1[i].style.left != xx || Temp1[i].style.top != yy) {