Gioco dei Numeri: Indovinare i Numeri Casuali
<!-- HTML code for the game -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gioco dei Numeri: Indovinare i Numeri Casuali</title>
<style>
table {
border-collapse: collapse;
width: 50%;
margin: 0 auto;
}
td {
padding: 10px;
border: 1px solid #ddd;
}
input[type="text"] {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
box-sizing: border-box;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
}
.risultato {
font-weight: bold;
}
</style>
</head>
<body>
<table>
<tr>
<td><input type="text" name="" id="InputA" placeholder="Indovina"></td>
<td><button>Controlla</button></td>
</tr>
<tr>
<td><input type="text" name="" id="InputB" placeholder="Indovina"></td>
<td><button>Controlla</button></td>
</tr> <tr>
<td><input type="text" name="" id="InputC" placeholder="Indovina"></td>
<td><button>Controlla</button></td>
</tr>
<tr>
<td>Tentativi primo:</td>
<td><div class="risultato" id="RisultatoA">0</div></td>
</tr>
<tr>
<td>Tentativi secondo:</td>
<td><div class="risultato" id="RisultatoB">0</div></td>
</tr>
<tr>
<td>Tentativi terzo:</td>
<td><div class="risultato" id="RisultatoC">0</div></td>
</tr>
<tr>
<td colspan="2"><button>Gioca ancora</button></td>
</tr>
</table>
<pre><code><script>
// Genera numeri casuali
var numberA = Math.floor(Math.random() * 10) + 1;
var numberB = Math.floor(Math.random() * 10) + 1;
var numberC = Math.floor(Math.random() * 10) + 1;
// Ottiene gli elementi di input
var inputA = document.getElementById("InputA");
var inputB = document.getElementById("InputB");
var inputC = document.getElementById("InputC");
// Ottiene gli elementi di risultato
var resultA = document.getElementById("RisultatoA");
var resultB = document.getElementById("RisultatoB");
var resultC = document.getElementById("RisultatoC");
// Inizializza il contatore dei tentativi
var attemptsA = 0;
var attemptsB = 0;
var attemptsC = 0;
// Funzione per controllare gli input
function checkInputs() {
// Ottiene i valori di input
var guessA = parseInt(inputA.value);
var guessB = parseInt(inputB.value);
var guessC = parseInt(inputC.value);
// Incrementa il contatore dei tentativi
attemptsA++;
attemptsB++;
attemptsC++;
// Controlla se le ipotesi corrispondono ai numeri casuali
if (guessA === numberA) {
resultA.innerText = "Vincita!";
} else {
resultA.innerText = attemptsA;
}
if (guessB === numberB) {
resultB.innerText = "Vincita!";
} else {
resultB.innerText = attemptsB;
}
if (guessC === numberC) {
resultC.innerText = "Vincita!";
} else {
resultC.innerText = attemptsC;
}
}
// Aggiunge un listener di eventi al pulsante
var buttons = document.querySelectorAll("button");
buttons.forEach(button => {
button.addEventListener("click", checkInputs);
});
</script>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/pcYW 著作权归作者所有。请勿转载和采集!