<!doctype html>
<!-- Assignment 11 : jQuery I -->
<html>
<head>
<title>Tic Tac Toe</title>
<meta name="viewport" content="width=600"/>
<link rel="stylesheet" href="main.css"/>
</head>
<body>
<h1>Tic-Tac-Toe</h1>
<div id="players">
<div id="X" class="">Player X</div>
<div id="O" class="">Player O</div>
<input type="button" class="button" value="New Game" id="newGame"/>
</div>
<table>
<tr>
<td id="c0"></td>
<td id="c1"></td>
<td id="c2"></td>
</tr>
<tr>
<td id="c3"></td>
<td id="c4"></td>
<td id="c5"></td>
</tr>
<tr>
<td id="c6"></td>
<td id="c7"></td>
<td id="c8"></td>
</tr>
</table>
<script src="jquery-1.11.2.min.js"></script>
<script src="main.js"></script>
</body>
</html>
我正在爲我的Javascript/jquery類的這個任務。我們正在編輯getBoard
和squareClicked
函數來尋找遊戲中的勝利。jquery功能錯誤 - 井字遊戲
checkWin
函數已爲我們預編程,所以錯誤不應該在那裏。
我在閱讀squareclicked
函數並更改贏得遊戲的正方形的背景顏色時遇到了困難。這可能是我的getBoard
功能編碼錯誤爲好。
任何幫助將是驚人的。
這個任務主要關注Jquery,所以請記住,我必須使用上面列出的兩個函數。對於作業11(實驗室19方案)
/* WEB 230 啓動文件 {梅根·卡扎} */
$(document).ready(function(){
$('#X').addClass('current-player');
function switchPlayer() {
var player = $('.current-player').attr('id');
$('#players div').removeClass('current-player');
if(player === 'X') {
$('#O').addClass('current-player');
} else {
$('#X').addClass('current-player');
}
}
$('table').on('click', squareClicked);
function squareClicked(e) {
var $sqr = $(e.target);
var player = $('.current-player').attr('id');
if(!$sqr.attr('class')) {
$sqr.addClass(player + '-marker');
switchPlayer();
}
checkWin();
if(win == true) {
$('winArray').css('background-color','#33CC99');
alert('Player ' + winner + ' won!');
}
}
$('#newGame').on('click',newGame);
function newGame() {
$('td').removeAttr('class');
$('#O').removeClass('current-player');
$('#X').addClass('current-player');
}
// Get an array of markers on each square
function getBoard() {
var board = [];
// Step 1: Your code here
$('td').each(function() {
var className = $(this).attr('class');
if (className == null) {
}
else {
board[this] = className.substring(0,1);
//alert(className.substring(0,1));
}
});
return board;
}
// This function is provided. You don't need to change it.
// Check for winner
function checkWin() {
var board = getBoard();
// array of possible win sets
var winArray = [
[0,1,2], [3,4,5], [6,7,8],
[0,3,6], [1,4,7], [2,5,8],
[0,4,8], [2,4,6] ];
var winInfo = {win: false};
// loop through the possible win sets
for(var i=0; i<winArray.length; i++) {
// get the marks at the three win locations
a = board[winArray[i][0]];
b = board[winArray[i][1]];
c = board[winArray[i][2]];
// see if the same marker is at each location
if(a && a === b && b === c) {
winInfo.win = true;
winInfo.play = winArray[i];
winInfo.winner = a;
return winInfo;
}
}
return winInfo;
}
});
可以爲您添加HTML代碼? –
html在單獨的文件中,所以我們只能編輯JavaScript文件上的內容。 –
選擇器可能是一個問題,也是爲什麼我想看到html代碼:)它也可能幫助這裏的其他人 –