Jump to content

dislav

Neophyte
  • Posts

    3
  • Joined

  • Last visited

Everything posted by dislav

  1. klierik, всё работает. Спасибо большое.
  2. klierik, её нужно добавить, что бы при нажатии срабатывал input. <input type="submit" value="Отправить" class="guessSubmit">
  3. Не думал что буду обращаться сюда. Я написал простую игру на JS. Активировать кнопку Enter не получается. Пытался найти решение в интернете. Если кому-то не трудно, помогите пожалуйста. Ещё подскажите в какую строку вставить активацию. Игру загрузил на бесплатный хостинг, можете посмотреть: http://f0535962.xsph.ru <!DOCTYPE html> <html lang="ru"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Guess</title> <style> html { font-family: sans-serif; font-size: 25px; text-align: center; color: white; } body { margin: 125px; background: linear-gradient(135deg, orange, salmon, coral, crimson); background-size: 400% 400%; animation: gradient 30s ease infinite; } @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } h1 { font-size: 60px; margin: 30px; } input.guessField { width: 244px; height: 64px; font-size: 25px; color: white; background-color: transparent; border: 3px solid white; border-radius: 25px; outline: none; padding: 0px; transition: all 0.5s ease; text-align: center; } input.guessField:hover { border-color: rgb(255, 255, 120); } input.guessSubmit { width: 250px; height: 70px; font-size: 25px; color: white; background-color: transparent; border: 3px solid white; border-radius: 25px; outline: none; padding: 0px; transition: all 0.5s ease; } input.guessSubmit:hover { border-color: rgb(255, 255, 120); } button { width: 250px; height: 70px; font-size: 25px; color: white; background-color: transparent; border: 3px solid white; border-radius: 25px; outline: none; padding: 0px; transition: all 0.5s ease; } button:hover { border-color: rgb(255, 255, 120); } </style> </head> <body> <h1>Угадайте число от 1 до 100</h1> <input type="text" class="guessField" maxlength="3"> <input type="submit" value="Отправить" class="guessSubmit"> <div class="resultParas"> <p class="guesses"></p> <p class="lastResult"></p> <p class="lowOrHi"></p> </div> <script> let randomNumber = Math.floor(Math.random() * 100) + 1; const guesses = document.querySelector('.guesses'); const lastResult = document.querySelector('.lastResult'); const lowOrHi = document.querySelector('.lowOrHi'); const guessSubmit = document.querySelector('.guessSubmit'); const guessField = document.querySelector('.guessField'); let guessCount = 1; let resetButton; function checkGuess() { let userGuess = Number(guessField.value); if (guessCount === 1) { guesses.textContent = 'Предыдущие догадки: '; } guesses.textContent += userGuess + ' '; if (userGuess === randomNumber) { lastResult.textContent = 'Поздравляю! Вы угадали!'; lowOrHi.textContent = ''; setGameOver(); } else if (guessCount === 5) { lastResult.textContent = 'Вы проиграли. Число: ' + randomNumber; lowOrHi.textContent = ''; setGameOver(); } else { lastResult.textContent = 'Неправильно.'; if (userGuess < randomNumber) { lowOrHi.textContent = 'Побробуйте взять число больше.'; } else if (userGuess > randomNumber) { lowOrHi.textContent = 'Побробуйте взять число меньше.'; } } guessCount++; guessField.value = ''; guessField.focus(); } guessSubmit.addEventListener('click', checkGuess); function setGameOver() { guessField.disabled = true; guessSubmit.disabled = true; resetButton = document.createElement('button'); resetButton.textContent = 'Начать новую игру'; document.body.appendChild(resetButton); resetButton.addEventListener('click', resetGame); } function resetGame() { guessCount = 1; const resetParas = document.querySelectorAll('.resultParas p'); for (let i = 0; i < resetParas.length; i++) { resetParas[i].textContent = ''; } resetButton.parentNode.removeChild(resetButton); guessField.disabled = false; guessSubmit.disabled = false; guessField.value = ''; guessField.focus(); randomNumber = Math.floor(Math.random() * 100) + 1; } </script> </body> </html>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy