作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我正在使用 html、css 和 JavaScript 编写井字游戏。我的 JavaScript 在外部 .js 文件中被引用到 .html 文件中。在 .js 文件中,我有一个名为 playerMove 的函数,它允许玩家移动并在玩家“x”和“o”之间切换。我要做的是确定获胜者。
这是我所拥有的:每个方 block ,当 onclick(this) 时,引用 playerMove(piece)。每次移动后,我想运行一个 if 语句来检查获胜者,但我不确定参数是否包含对“piece”或 a、b 和 c 的引用。任何建议将不胜感激。
var turn = 0;
a = document.getElementById("topLeftSquare").innerHTML;
b = document.getElementById("topMiddleSquare").innerHTML;
c = document.getElementById("topRightSquare").innerHTML;
function playerMove(piece) {
var win;
if(piece.innerHTML != 'X' && piece.innerHTML != 'O'){
if(turn % 2 == 0){
document.getElementById('playerDisplay').innerHTML= "X Plays " + printEquation(1);
piece.innerHTML = 'X';
window.setInterval("X", 10000)
piece.style.color = "red";
if(piece.innerHTML == 'X')
window.alert("X WINS!");
}
else {
document.getElementById('playerDisplay').innerHTML= "O Plays " + printEquation(1);
piece.innerHTML = 'O';
piece.style.color = "brown";
//document.getElementById('playerDisplay').innerHTML = "O Plays";
//win = winner();
}
turn+=1;
}
html代码:
<div id="board">
<div class="topLeftSquare" onclick="playerMove(this)">
</div>
<div class="topMiddleSquare" onclick="playerMove(this)">
</div>
<div class="topRightSquare" onclick="playerMove(this)">
</div>
</div>
最佳答案
<html>
<head>
<script type="text/javascript">
var cur_id;
var tempkeycode = "";
function setKeycode(input)
{
tempkeycode = input;
xowin()
}
function setId(id)
{
cur_id = id;
xowin()
}
function keyPress(e)
{
var input = e.keyCode ? e.keyCode : e.charCode;
if(tempkeycode == "")
{
if ((input == 111) || (input == 120))
{
setKeycode(input);
return true;
}
else
return false;
}
else
{
if(((input == 111) || (input == 120)) && (input != tempkeycode))
{
setKeycode(input);
return true;
}
else
{
return false;
}
}
}
function preventBackspace(e)
{
var evt = e || window.event;
if (evt)
{
var keyCode = evt.charCode || evt.keyCode;
if (keyCode === 8)
{
if (evt.preventDefault)
{
evt.preventDefault();
}
else
{
evt.returnValue = false;
}
}
}
}
function xowin()
{
tb1val = document.getElementById("tb1").value;
tb2val = document.getElementById("tb2").value;
tb3val = document.getElementById("tb3").value;
tb4val = document.getElementById("tb4").value;
tb5val = document.getElementById("tb5").value;
tb6val = document.getElementById("tb6").value;
tb7val = document.getElementById("tb7").value;
tb8val = document.getElementById("tb8").value;
tb9val = document.getElementById("tb9").value;
if(tb1val == tb2val && tb2val == tb3val && tb1val!= "" && tb2val!= "" && tb3val!= "")
{
alert("Player "+tb1val+" Wins!!!");
}
else if(tb4val == tb5val && tb5val == tb6val && tb4val!= "" && tb5val!= "" && tb6val!= "")
{
alert("Player "+tb5val+" Wins!!!");
}
else if(tb7val == tb8val && tb8val == tb9val && tb7val!= "" && tb8val!= "" && tb9val!= "")
{
alert("Player "+tb7val+" Wins!!!");
}
else if(tb1val == tb4val && tb4val == tb7val && tb1val!= "" && tb4val!= "" && tb7val!= "")
{
alert("Player "+tb4val+" Wins!!!");
}
else if(tb2val == tb5val && tb5val == tb8val && tb2val!= "" && tb5val!= "" && tb8val!= "")
{
alert("Player "+tb2val+" Wins!!!");
}
else if(tb3val == tb6val && tb6val == tb9val && tb3val!= "" && tb6val!= "" && tb9val!= "")
{
alert("Player "+tb6val+" Wins!!!");
}
else if(tb1val == tb5val && tb5val == tb9val && tb1val!= "" && tb5val!= "" && tb9val!= "")
{
alert("Player "+tb9val+" Wins!!!");
}
else if(tb3val == tb5val && tb5val == tb7val && tb3val!= "" && tb5val!= "" && tb7val!= "")
{
alert("Player "+tb3val+" Wins!!!");
}
else
{
if(tb1val!= "" && tb2val!= "" && tb3val!= "" && tb4val!= "" && tb5val!= "" && tb6val!= "" && tb7val!= "" && tb8val!= "" && tb9val!= "")
{
alert("Draw");
}
}
}
</script>
</head>
<body bgcolor="blue">
<center>
<h1>Tic Tac Toe</h1>
<input type="text" id="tb1" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb2" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb3" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1"><br>
<input type="text" id="tb4" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb5" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb6" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1"><br>
<input type="text" id="tb7" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb8" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1">
<input type="text" id="tb9" value="" size="1" onkeydown="preventBackspace(event)" onkeypress="return keyPress(event)" onblur="setId(this.id);" maxlength="1"><br>
</center>
</body>
</html>
关于Javascript 和 html 井字游戏赢家,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12589596/
我有一个模板,可以获取从外部程序生成的所有信息。我试图让这个模板更现代一点,而不是 1992 年。 用于处理表格的页面。它看起来不太好,所以我试图移除 table ,让屏幕上的所有内容都流畅。 对于文
我使用 bootstrap 井来模拟卡片。我目前有两种不同类型的卡片,“普通”卡片位于屏幕中间,“特殊”卡片位于左侧和右侧。 我正在尝试复制的模板: 问题: 1.) bootstrap 中的井似乎不想
我有一个井 div,我想在 Angular 落附上一个小文本/图像,如此处所示 ( http://draw.to/D46BqsC )...并让该元素相对于井放置,以便它发生变化位置和井一样。什么是最好
我是一名优秀的程序员,十分优秀!