-4
Мне нужна моя переменная для печати. Я не уверен, почему это происходит, основанная на знаке подчеркивания в моей игре палача в самых последних частях сниппера HTML ниже. Точнее, часть прямо под мной.Переменная не работает (не знаю почему) javascript
//list of words
var wordList = ["apple", "peach", "pear", "mango", "banana", "paper", "pens", "laptop", "desk", "chair", "star", "sky", "moon", "sun", "planets"];
//picking a random word from the list
var word = wordList[Math.floor(Math.random() * wordList.length)];
function replaceAt(str,index,chr) {
if(index != -1) {
str = str.substr(0,index) + chr + str.substr(index+1);
}
return str;
}
//checking if enter is pressed
document.addEventListener('keydown', function(event) {
if(event.keyCode == 13) {
//checking if letter is in the word
alert(word);
alert(underscore + " " + letter + " " + word.indexOf(letter));
underscore = replaceAt(underscore, word.indexOf(letter * 2), letter);
context.clearRect(canvas.width * 0.4, canvas.height * 0.3, canvas.width *0.7, canvas.height * 70);
context.font = '50pt Calibri';
context.textAlign = 'center';
context.fillStyle = '#E2E2E3';
context.fillText(underscore, canvas.width * 0.5, canvas.height * 0.70);
}
});
Я ужасен JavaScript и новичок в этом. Заранее благодарю за то, что вы терпите мое раздражение.
/* Hangman Game CSS File */
body
{
\t background-color: #1B264F;
}
#main {
\t background-color: #5386E4;
\t height: 97vh;
\t width: 95vw;
\t vertical-align: middle;
}
canvas {
padding-left: 0;
padding-right: 0;
margin-left: auto;
margin-right: auto;
display: block;
margin-top: auto;
margin-bottom: auto;
}
/* colour scheme hex
lightest blue: #5386E4;
middle blue: #274690;
darkest blue: #1B264F;
black color: #070707;
white color: #E2E2E3;
*/<!DOCTYPE html>
<html>
\t <head>
\t \t <title>Hangman by Lachlan Teale</title> \t
\t \t <meta name="description" content="Lachlan Teale's Hangman Game 2015">
\t \t <meta name="keywords" content="hangman, lachlan, teale, Javascript">
\t \t <meta charset="UTF-8">
\t \t <meta name="author" content="Lachlan Teale">
\t \t <link rel="stylesheet" type="text/css" href="style.css">
\t </head>
\t <body>
\t <canvas id="main" width="1920" height="1080" style="border:1px solid #d3d3d3;"></canvas>
\t <script type="text/javascript">
\t //setting variables
\t \t var canvas = document.getElementById('main');
\t var context = canvas.getContext('2d');
\t var underscore = "";
\t var letter;
\t var complete = false;
\t //list of words
\t \t var wordList = ["apple", "peach", "pear", "mango", "banana", "paper", "pens", "laptop", "desk", "chair", "star", "sky", "moon", "sun", "planets"];
\t //picking a random word from the list
\t \t var word = wordList[Math.floor(Math.random() * wordList.length)];
\t //print out the underscores for the number of letters
\t \t for (i = 0; i < word.length; i++) \t {
\t \t \t var underscore = underscore + "_ ";
\t \t }
\t \t context.font = '50pt Calibri';
\t context.textAlign = 'center';
\t context.fillStyle = '#E2E2E3';
\t context.fillText(underscore, canvas.width * 0.5, canvas.height * 0.70);
//correct letter text
\t context.font = 'bold 30pt Calibri';
\t context.textAlign = 'center';
\t context.fillStyle = '#E2E2E3';
\t context.text
\t context.fillText("Correct Letters", canvas.width * 0.08, canvas.height * 0.05);
//Wrong Letter text
\t context.font = 'bold 30pt Calibri';
\t context.textAlign = 'center';
\t context.fillStyle = '#E2E2E3';
\t context.text
\t context.fillText("Wrong Letters", canvas.width - (canvas.width * 0.08), canvas.height * 0.05);
\t //checking which button is pressed
\t \t window.addEventListener('keydown', function(event) {
\t \t \t if (event.keyCode >= 65 && event.keyCode <= 90) {
\t \t \t context.clearRect(0, canvas.height * 0.80, canvas.width, canvas.height);
\t \t letter = String.fromCharCode(event.keyCode).toLowerCase();
\t \t context.font = '50pt Calibri';
\t \t \t context.textAlign = 'center';
\t \t \t context.fillStyle = '#E2E2E3';
\t \t \t context.fillText(letter, canvas.width * 0.5, canvas.height * 0.85);
\t \t }
\t \t });
\t //checking if back key is pressed
\t \t document.addEventListener('keydown', function(event) {
\t \t if (event.keyCode == 8) { \t \t \t \t \t \t \t \t \t \t \t
\t \t \t context.clearRect(0, canvas.height * 0.80, canvas.width, canvas.height);
\t \t }
\t });
\t //function for replacing letter
\t \t function replaceAt(str,index,chr) {
\t \t if(index != -1) {
\t \t \t str = str.substr(0,index) + chr + str.substr(index+1);
\t \t \t }
\t \t \t return str;
\t \t }
\t //checking if enter is pressed
\t document.addEventListener('keydown', function(event) {
\t \t if(event.keyCode == 13) {
//checking if letter is in the word
\t \t \t alert(word);
\t \t \t \t alert(underscore + " " + letter + " " + word.indexOf(letter));
\t \t \t \t underscore = replaceAt(underscore, word.indexOf(letter * 2), letter);
\t \t \t \t context.clearRect(canvas.width * 0.4, canvas.height * 0.3, canvas.width *0.7, canvas.height * 70);
\t \t \t context.font = '50pt Calibri';
\t \t \t context.textAlign = 'center';
\t \t \t context.fillStyle = '#E2E2E3';
\t \t \t context.fillText(underscore, canvas.width * 0.5, canvas.height * 0.70);
\t \t \t
\t \t \t }
\t });
\t \t
\t \t </script>
\t </body>
</html>
Просьба ... ** ** ** ** Отдельный пример (также полезно изолировать проблему) ... –
Что вы подразумеваете под ** // проверяете, есть ли буква в слове **? 'alert (word);' не может работать ... слово не определено – gr3g
Прошу прощения @ gr3g. Я забыл включить это в код. Фактически это определяется во всем. Я отредактировал фрагмент, чтобы включить это. – MrTeale