Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá, estou tendo que desenvolver um jogo de batalha naval em javascript para a faculdade até ai tudo bem.
O problema é que quando eu submeto o formulário para chamar a função em javascript para criar o tabuleiro a página é recarregada logo em seguida e o meu tabuleiro desaparece :/ , eu só consigo visualizar o tabuleiro, pois estou inserindo um "alert" no final da função.
Então alguém sabe como impedir de uma página ser recarregada? Após a página submeter um formulário.
Segui o meu código.
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="resources/css/index.css" />
<title>Batalha Naval</title>
</head>
<body onload="loginCookie()">
<form onsubmit="return inicializarTabuleiro()">
<input type="number" id="numLinhas" required min="3" max="8" placeholder="Nº de linhas" />
<input type="number" id="numColunas" required min="3" max="8" placeholder="Nº de colunas" />
<input type="number" id="numTentativas" required min="1" max="64" placeholder="Nº de tentativas" />
<input type="submit" value="Criar" />
<input type="button" value="Ver Ranking" onclick="exibirRanking()"/>
<input type="button" value="Limpar Ranking" onclick="deleteCookie()"/>
<div id="barraDeInformacoes"></div>
</form>
<div id="panel_fundo"></div>
<div id="ranking">
<p id="tituloDoRanking"></p>
<table id="listaDoRanking">
<thead>
<tr>
<td>Data</td><td>Hora</td><td>Tamanho</td><td>Tentativas</td><td>Duração(seg.)</td>
</tr>
</thead>
<tbody id="corpoDaListaDoRanking"></tbody>
</table>
<input type="button" id="btnFecharRanking" value="Fechar Ranking" onclick="fecharRanking()"/>
</div>
<table id="tabuleiro"></table>
<script type="text/javascript" src="resources/js/index.js"></script>
</body>
</html>
function inicializarTabuleiro(){
var numLinhas = document.getElementById("numLinhas").value;
var numColunas = document.getElementById("numColunas").value;
var numTentativas = document.getElementById("numTentativas").value;
if (validar(numLinhas, numColunas, numTentativas)
== false){
alert("false");
return false;
}
var tabela = document.getElementById("tabuleiro");
criar_tabela(numLinhas, numColunas, numTentativas, tabela);
alert("teste");
return true;
}
function validar(numLinhas, numColunas, numTentativas){
if(numLinhas == 0 || numLinhas < 3 || numLinhas > 8){
return false;
}else if(numColunas == 0 || numColunas < 3 || numColunas > 8){
return false;
}else if(numTentativas == 0 || numTentativas < 1 || numTentativas > 64){
return false;
}function criar_tabela(numLinhas, numColunas, numTentativas, tabela){
for (var i = 0; i < numLinhas; i++) {
var ultima = tabela.rows.length;
var linha = document.createElement("tr");
linha.setAttribute("id","line"+ultima);
for (var j = 0; j < numColunas; j++) {
var celula = document.createElement("td");
var elemento = document.createElement("button");
celula.appendChild(elemento);
linha.appendChild(celula);
};//for - j
tabela.appendChild(linha);
};//for - iCarregando comentários...