Tictactoe выигрышное заявление - PullRequest
Новая
       75

Tictactoe выигрышное заявление

0 голосов
/ 29 апреля 2020

Я сделал тиктактое, я тоже сделал заявление о победе, но оно не работает, и я не знаю почему. HTML

<!DOCTYPE html>
<html>
<head>
<script src="tictactoe.js"></script>
<link rel="stylesheet" type="text/css" href="tictactoe.css">
<meta charset="utf-8">
</head>
<body>
<table style="width:100%" style="height:10%" id="table1">
<tr id="vmi">
<td class="cella" id="tr0td1"></td>
<td class="cella" id="tr0td2"></td>
<td class="cella" id="tr0td3"></td>
<td class="cella" id="tr0td4"></td>
<td class="cella" id="tr0td5"></td>
</tr>
<tr>
<td class="cella" id="tr1td1"></td>
<td class="cella" id="tr1td2"></td>
<td class="cella" id="tr1td3"></td>
<td class="cella" id="tr1td4"></td>
<td class="cella" id="tr1td5"></td>
</tr>
<tr>
<td class="cella" id="tr2td1"></td>
<td class="cella" id="tr2td2"></td>
<td class="cella" id="tr2td3"></td>
<td class="cella" id="tr2td4"></td>
<td class="cella" id="tr2td5"></td>
</tr>
<tr>
<td class="cella" id="tr3td1"></td>
<td class="cella" id="tr3td2"></td>
<td class="cella" id="tr3td3"></td>
<td class="cella" id="tr3td4"></td>
<td class="cella" id="tr3td5"></td>
</tr>
<tr>
<td class="cella" id="tr4td1"></td>
<td class="cella" id="tr4td2"></td>
<td class="cella" id="tr4td3"></td>
<td class="cella" id="tr4td4"></td>
<td class="cella" id="tr4td5"></td>
</tr>
</table>
<form>
Character(X or O):
<input type="text" id='character' name='Character' class='editor'>
<label for='tr'>Row: <input id='sor' type='number' min='0' name='Sor'> 
<label for='td'>Column: <input id='column'type='number' name='Column' max='5'>
<button type='button' onclick="addXO()">submit</button> 

</form>
<button type='button' onclick="winning()">Did I win?</button>

И это мое JS: 

function addXO() {
    var row = document.getElementById('sor').value;
    var column = document.getElementById('column').value;
    var character = document.getElementById('character').value;

document.getElementById('tr'+row+'td'+column).innerHTML  = character;}

function winning(){
    var tr0td1val=document.getElementById("tr0td1").value;
    var tr0td2val=document.getElementById("tr0td2").value;
    var tr0td3val=document.getElementById("tr0td3").value;
    var tr0td4val=document.getElementById("tr0td4").value;
    var tr0td5val=document.getElementById("tr0td5").value;
    var tr1td1val=document.getElementById("tr1td1").value;
    var tr1td2val=document.getElementById("tr1td2").value;
    var tr1td3val=document.getElementById("tr1td3").value;
    var tr1td4val=document.getElementById("tr1td4").value;
    var tr1td5val=document.getElementById("tr1td5").value;
    var tr2td1val=document.getElementById("tr2td1").value;
    var tr2td2val=document.getElementById("tr2td2").value;
    var tr2td3val=document.getElementById("tr2td3").value;
    var tr2td4val=document.getElementById("tr2td4").value;
    var tr2td5val=document.getElementById("tr2td5").value;
    var tr3td1val=document.getElementById("tr3td1").value;
    var tr3td2val=document.getElementById("tr3td2").value;
    var tr3td3val=document.getElementById("tr3td3").value;
    var tr3td4val=document.getElementById("tr3td4").value;
    var tr3td5val=document.getElementById("tr3td5").value;
    var tr4td1val=document.getElementById("tr4td1").value;
    var tr4td2val=document.getElementById("tr4td2").value;
    var tr4td3val=document.getElementById("tr4td3").value;
    var tr4td4val=document.getElementById("tr4td4").value;
    var tr4td5val=document.getElementById("tr4td5").value;
    if(tr0td1val == tr0td2val && tr0td2val == tr0td3val && tr0td3val == tr0td4val && tr0td4val == tr0td5val && tr0td1val!= "" && tr0td2val!= "" && tr0td3val!= "" && tr0td4val!= "" && tr0td5val!= "")
    {
        alert("Player"+tr0td1val+" won!");
    }
    else if(tr1td1val == tr1td2val && tr1td2val == tr1td3val && tr1td3val == tr1td4val && tr1td4val == tr1d5val && tr1td1val!= "" && tr1td2val!= "" && tr1td3val!= "" && tr1td4val!= "" && tr1td5val!= "")
    {
        alert("Player"+tr1td1val+" won!");
    }
    else if(tr2td1val == tr2td2val && tr2td2val == tr2td3val && tr2td3val == tr2td4val && tr2td4val == tr2d5val && tr2td1val!= "" && tr2td2val!= "" && tr2td3val!= "" && tr2td4val!= "" && tr2td5val!= "")
    {
        alert("Player"+tr2td1val+" won!");
    }
    else if(tr3td1val == tr3td2val && tr3td2val == tr3td3val && tr3td3val == tr3td4val && tr3td4val == tr3d5val && tr3td1val!= "" && tr3td2val!= "" && tr3td3val!= "" && tr3td4val!= "" && tr3td5val!= "")
    {
        alert("Player"+tr3td1val+" won!");
    }
    else if(tr4td1val == tr4td2val && tr4td2val == tr4td3val && tr4td3val == tr4td4val && tr4td4val == tr4d5val && tr4td1val!= "" && tr4td2val!= "" && tr4td3val!= "" && tr4td4val!= "" && tr4td5val!= "")
    {
        alert("Player"+tr4td1val+" won!");
    }
    else if(tr0td1val == tr1td1val && tr1td1val == tr2td1val && tr2td1val == tr3td1val && tr3td1val == tr4d1val && tr0td1val!= "" && tr1td1val!= "" && tr2td1val!= "" && tr3td1val!= "" && tr4td1val!= "")
    {
        alert("Player"+tr0td1val+" won!");
    }
    else if(tr0td2val == tr1td2val && tr1td2val == tr2td2val && tr2td2val == tr3td2val && tr3td2val == tr4d2val && tr0td2val!= "" && tr1td2val!= "" && tr2td2val!= "" && tr3td2val!= "" && tr4td2val!= "")
    {
        alert("Player"+tr0td2val+" won!");
    }
    else if(tr0td3val == tr1td3val && tr1td3val == tr2td3val && tr2td3val == tr3td3val && tr3td3val == tr4d3val && tr0td3val!= "" && tr1td3val!= "" && tr2td3val!= "" && tr3td3val!= "" && tr4td3val!= "")
    {
        alert("Player"+tr0td3val+" won!");
    }
    else if(tr0td4val == tr1td4val && tr1td4val == tr2td4val && tr2td4val == tr3td4val && tr3td4val == tr4d4val && tr0td4val!= "" && tr1td4val!= "" && tr2td4val!= "" && tr3td4val!= "" && tr4td4val!= "")
    {
        alert("Player"+tr0td4val+" won!");
    }
    else if(tr0td5val == tr1td5val && tr1td5val == tr2td5val && tr2td5val == tr3td5val && tr3td5val == tr4d5val && tr0td5val!= "" && tr1td5val!= "" && tr2td5val!= "" && tr3td5al!= "" && tr4td5val!= "")
    {
        alert("Player"+tr0td5val+"won!");
    }
    }

Я понятия не имею, почему это не работает, пока я объявил, что если в затем игрок выиграл, но вместо этого мой код считает, что игрок всегда выигрывает. И у меня есть еще один вопрос, я сделал это JS, но я должен был также сделать PHP (учитель попросил нас сделать это), и JS и PHP не работают одновременно.

1 Ответ

0 голосов
/ 29 апреля 2020

Ошибка, которая нарушает ваш код, состоит в том, что вы получаете доступ к «значению» элементов td, но у них их нет. (поэтому все возвращают undefined, что не равно "".

. Чтобы исправить это, замените document.getElementById("tr0td1").value на document.getElementById("tr0td1").innerHTML (для всех ячеек)

. Я также рекомендую использовать innerText везде innerHTML везде, куда вы не хотите вставлять HTML код.

Вам также не нужно проверять все ячейки, чтобы не быть "". Если вы проверите первый один и что они все одинаковые, других не может быть "".

if(tr0td1val != "" && tr0td1val == tr0td2val && tr0td2val == tr0td3val && tr0td3val == tr0td4val && tr0td4val == tr0td5val) достаточно.

...