如何解决如何将字符从1到3个正方形移动到网格上？
我需要在js和jquery中制作回合制游戏。规则是：
我已经迈出了第一步，但是我在搬家方面很挣扎，所以我想知道是否有人可以提供帮助？ 谢谢！
let player1 = {};
let player2 = {};
var toolBox = {
initialiserEmptyTab: function(nbLines,nbCols,car = ''){
var tab = [];
for(var i = 0;i < nbLines;i++){
var lines = [];
for(var j =0;j < nbCols; j++){
ligne.push(car);
}
tab.push(lines);
}
return tab;
}
}
var game = {
nbCols : 10,nbLines : 10,grid : [],// initialization of the elements and the grid via the toolBox
initialisation() {
this.grid = toolBox.initialisationEmptyTab(this.nbLines,this.nbCols,0);
this.positioningP1(1,1); // nombre de cases(nombre),id(player)
this.positioningP2(1,2);
this.positioningObstacles(15,3)
this.positioningWeapons(1,4)
this.positioningWeapons(1,5)
this.positioningWeapons(1,6)
this.positioningWeapons(1,7)
},getCase(xRandom,yRandom) { // to create x and y
var cellule = {};
cellule.x = xRandom;
cellule.y = yRandom;
return cellule;
},verifEmptyBox(caseB) { // to check if the Box is empty
if(this.grid[caseB.x][caseB.y] === 0){
return true;
} else {
return false;
}
},showGrid() { // all of what we see on the grid
const game = document.querySelector("#game");
game.innerHTML = "";
var content = "<table>";
for(var i = 0; i < this.nbLines;i++) {
content += "<tr>";
for(var j = 0 ; j < this.nbCols;j++) {
content += "<td class='border border-dark text-center' style='width:60px;height:60px'>";
if(this.grid[i][j] === 0) {
// empty square
}
if(this.grid[i][j] === 1) {
content += "<img src='/img/P1.png' class='bg-danger rounded-circle' style='width:50px;height:50px' />";
}
if(this.grid[i][j] === 2) {
content += "<img src='/img/P2.png' class='bg-info rounded-circle' style='width:50px;height:50px' />";
}
if(this.grid[i][j] === 3) {
content += "<img src='/img/roche.png' style='width:50px;height:50px'/>";
}
if(this.grid[i][j] === 4) {
content += "<img src='/img/weapon1.png' style='width:40px;height:40px'/>";
}
if(this.grid[i][j] === 5) {
content += "<img src='/img/weapon2.png' style='width:40px;height:40px'/>";
}
if(this.grid[i][j] === 6) {
content += "<img src='/img/weapon3.png' style='width:40px;height:40px'/>";
}
if(this.grid[i][j] === 7) {
content += "<img src='/img/weapon4.png' style='width:40px;height:40px'/>";
}
content += "</td>";
}
content += "</tr>";
}
content += "</table>";
game.innerHTML = content;
},positioningP1(nombre,player) {
for(var i = 0 ; i < nombre ; i++) {
let xRandom = Math.floor(Math.random() * (this.nbLines-1));
let yRandom = Math.floor(Math.random() * (this.nbCols-1));
let posPlayer = {};
posPlayer["case"+i] = this.getCase(xRandom,yRandom);
player1 = posPlayer["case"+i];
console.log(player1);
let emptyBox = this.verifemptyBox(posPlayer["case"+i]);
if(emptyBox == true) {
this.saveCoords(posPlayer,player);
} else {
i--;
}
}
},positioningP2(nombre,player) {
let i = 0;
while(i < nombre) {
i = 0;
let xRandom = Math.floor(Math.random() * (this.nbLines-1));
let yRandom = Math.floor(Math.random() * (this.nbCols-1));
let posPlayer = {};
posPlayer["case"+i] = this.getCase(xRandom,yRandom);
player2 = posPlayer["case"+i];
console.log(player2);
let emptyBox = this.verifemptyBox(posPlayer["case"+i]); // from there,avoids that the characters are side by side.
if(emptyBox == true && (Math.abs(player2.x - player1.x) >= 1
&& Math.abs(player2.y - player1.y))) { //checks the absolute difference between the rows and columns of the two players
console.log("true");
this.saveCoords(posPlayer,player);
i++;
} else {
console.log(false);
player2 = [''];
i--;
}
}
},saveCoords(posPlayer,player) { //save the coords
for(var cellule in posPlayer) {
this.grid[posPlayer[cellule].x][posPlayer[cellule].y] = player;
}
},positioningObstacles(nombre,obstacles) {
var posObstacles = {}; //object
var xRandom = 0;
var yRandom = 0;
var emptyBox = true;
for(var i = 1 ; i <= nombre ; i++) {
xRandom = Math.floor(Math.random() * (this.nbLines-1));
yRandom = Math.floor(Math.random() * (this.nbCols-1));
posObstacles["case"+i] = this.getCase(xRandom,yRandom);
emptyBox = this.verifemptyBox(posObstacles["case"+i]);
if(emptyBox == true) {
this.saveCoordsObstacles(posObstacles,obstacles);
} else {
i--;
}
}
},saveCoordsObstacles(posObstacles,obstacles) {
for(var cellule in posObstacles) {
this.grid[posObstacles[cellule].x][posObstacles[cellule].y] = obstacles;
}
},positioningWeapons(nombre,Weapons) {
var posWeapons = {}; //object
var xRandom = 0;
var yRandom = 0;
var emptyBox = true;
for(var i = 1 ; i <= nombre ; i++) {
xRandom = Math.floor(Math.random() * (this.nbLines-1));
yRandom = Math.floor(Math.random() * (this.nbCols-1));
posWeapons["case"+i] = this.getCase(xRandom,yRandom);
emptyBox = this.verifemptyBox(posWeapons["case"+i]);
if(emptyBox == true) {
this.saveCoordsObstacles(posWeapons,Weapons);
} else {
i--;
}
}
},saveCoordsWeapons(posWeapons,Weapons) {
for(var cellule in posWeapons) {
this.grid[posWeapons[cellule].x][posWeapons[cellule].y] = Weapons;
}
},}
// initialisation of the map
game.initialisation();
game.showGrid();
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
