Я не очень хорошо разбираюсь в программировании, и у меня есть несколько проблем с моей игрой «Виселица».

Я только начинаю учиться использовать javascript, и у меня есть несколько проблем с моим кодом. Нас попросили сделать игру про палача, и я разработал необходимый код, чтобы заставить работать «правильные» буквы и «неправильные» буквы. Однако мне нужно, чтобы мой код отображал символы звездочки, а не поля, в которые входят буквы. Мне также нужно, чтобы он поздравлял пользователя, когда он правильно угадал слово. Я предполагаю, что проще всего было бы «предупредить» пользователя. Эта часть не обязательна, но я также хотел бы знать, как добавить изображения «палача» в код. Итак, скажем, пользователь угадывает неправильную букву, тогда он будет строить палача из изображений.

Я знаю, что много прошу, но звездочки вместо прямоугольников и оповещение — это то, что я действительно ищу. Любая помощь будет оценена по достоинству.

Это мой html-код для моего javascript-кода.

<html>
<head>
<title>HangmanProgram</title>    
</head>
    <script src="functions.js"></script>
<body>
<H1><bold><center> Hangman Program</h1>
<h3> The Hangman Game.
<br>     
Click Start Game button. Type a letter in the "Guess" box and then click "Guess". 
<br> 
Click Reset button to play again.
<br>
<br>

<Form name = "hangmanForm">
<input type="button" value="Start Game" onclick="getword()"><br>
<!-- Hidden field for storing answer -->
<input type="hidden" name="answer" value=""/> 
<input type="button" value="Guess" onclick="formCheck()">
<input name = "ltr" type="text" size = "1"><br>

<br>The Word is:
<input name = "letterone" type="text" size = "1">
<input name = "lettertwo" type="text" size = "1">
<input name = "letterthree" type="text" size = "1">
<input name = "letterfour" type="text" size = "1">
<BR>
<BR>
Wrong Letters<input name = "wrongletters" type="text" size = "24">
<BR>
<BR>
<input type="reset" value="Reset">
</form>
</head>
</body>
</html>

ниже мой код JavaScript

// Get a random number
function get_random()
{
  document.hangmanform.ltr.focus();
    var ranword= Math.floor(Math.random()*11);
    return ranword;
    }

    // Fetch the possible words using random number and array of choices
function getword()
    {
        var userguess=get_random();

    var words =new Array(11);
        words[0]="note";
        words[1]="duck";
        words[2]="cake";
        words[3]="lake";
        words[4]="stop";
        words[5]="know";
        words[6]="dogs";
        words[7]="play";
        words[8]="fair";
        words[9]="sexy";
        words[10]="love";

        var answer = words[userguess];

        // Set hidden field to answer.
        hangmanform.answer.value = answer;

    }

    function formCheck()
    {
    // Read answer and decide if guess is in the string.
        var answer = hangmanform.answer.value;
        var vposition = answer.indexOf(hangmanform.ltr.value);

    // If it is not the word, add to wrong letters box.
        if (vposition == -1) {
            hangmanform.wrongletters.value = hangmanform.ltr.value + " " + hangmanform.wrongletters.value;
        }
        else {

            // Guess in string
            switch (vposition) {
                case 0:
                hangmanform.letterone.value = answer.substring(0,1);
                break;
                case 1:
                hangmanform.lettertwo.value = answer.substring(1,2);
                break;
                case 2:
                hangmanform.letterthree.value = answer.substring(2,3);
                break;
                case 3:
                hangmanform.letterfour.value = answer.substring(3,4);
            }

        }

        // Set form guess box to empty string NOT SPACE
        hangmanform.ltr.value ="";
        hangmanform.ltr.focus();
    }

person BeginnerTanya    schedule 22.03.2014    source источник
comment
У вас есть несколько открытых тегов html, которые не соответствуют тегам закрытия, как здесь: <H1><bold><center> Hangman Program</h1>, где <bold> будет продолжать применяться к тому, что следует за <h1>. Точно так же в конце вашего html вы снова закрываете </head> после закрытия </body>, но это должно быть <html><head></head></body></body></html>. Чистый html значительно упрощает работу с JavaScript.   -  person Jason Aller    schedule 23.03.2014
comment
См. jsfiddle.net/pL7jk/2, где можно найти более чистый HTML-код и несколько замечаний по дизайну, которые следует учитывать в отношении <input> против <span> для элементов, с которыми пользователю не нужно взаимодействовать. Обратите внимание, что центр для <h1> перемещен в .css   -  person Jason Aller    schedule 23.03.2014
comment
Я очистил свой код, но я все еще не знаю, как отображать символы звездочки вместо полей, в которые идут правильные буквы. Как я могу это сделать?   -  person BeginnerTanya    schedule 25.03.2014


Ответы (2)


JavaScript чувствителен к регистру. Итак, name, Name и NAME считаются разными идентификаторами, которые можно использовать одновременно для разных значений.

В данном случае это означает, что каждая ссылка на hangmanform (нижний регистр) в сценарии должна быть hangmanForm (верблюжий регистр), чтобы соответствовать регистру, используемому <form name="hangmanForm">.

// ...

function formCheck()
{
// Read answer and decide if guess is in the string.
    var answer = hangmanForm.answer.value;
    var vposition = answer.indexOf(hangmanForm.ltr.value);

// ...

Кроме того, хотя автоматические глобальные переменные становятся стандартом, все еще не обязательно полагаться на них, поскольку они все еще могут конфликтовать с другими вариантами использования глобальных переменных.

// ...

function formCheck()
{
// Read answer and decide if guess is in the string.
    var form = document.getElementsByName('hangmanForm')[0];
    var answer = form.answer.value;
    var vposition = answer.indexOf(form.ltr.value);

// ...

MDN: getElementsByName()

person Jonathan Lonowski    schedule 22.03.2014
comment
Хорошо, теперь я вижу, что игра не сбрасывается и не позволяет размещать новое слово, когда вы нажимаете «Сброс». Я также до сих пор не показываю символы звездочки там, где пустые поля для букв в слове. Есть ли шанс, что вы знаете, как я могу получить это? - person BeginnerTanya; 23.03.2014

<span> может быть <span id="letters">* * * *</span> и может быть адресован с помощью:

var letters = document.getElementById('letters'),
    chars = letters.textContent.split(' ');
chars[2] = 'X'; // change the third * to the letter X
letters.textContent = chars.join(' ');
person Jason Aller    schedule 24.03.2014