我不太擅长编码，我的刽子手游戏遇到了一些问题

我刚刚开始学习如何使用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();
    }

JavaScript区分大小写。因此，name, Name, NAME被认为是不同的标识符，可以同时用于不同的值。

在这种情况下，这意味着脚本中对hangmanform(小写)的每个引用都应该是hangmanForm (camelCase)，以匹配<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()

<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(' ');

相关内容

最新更新

热门标签：