Question

我想制作基于控制台的文字游戏。当用户写下他的名字时，它应该用年龄输入调用一个函数，在年龄输入后它应该调用性别输入。但是当我写下我的年龄时，它再次调用getAge +下一个函数。在下一个函数之后，它调用getAge + next函数+ next函数。我希望你知道，我的意思。我该如何解决？我尝试了回调，但没有帮助。

$(document).ready(function(){
    var Player = {
        username : "",
        age : null,
        sex : "",
        
    };
    
    function textArea($text){
       return $('#textArea').val($('#textArea').val() + $text);  
    };
    
    function clearInput(){
        return $('#inputs').val('');
    }
    
    var functions = {
        start : function start(){
            functions.getUsername();
        },
        //START GET USERNAME
        getUsername : function getUserName(callback){

            //Hello! Tell me your username!
            textArea("Vítej! Zadej svou přezdívku!");
    
            $('#inputs').keypress(function (e){
                if (e.which == 13){
                    Player.username = $('#inputs').val();
                    textArea("\n" + Player.username + "\n");
                    clearInput();
                    functions.getAge();
                }
            });
        },
        //END GET USERNAME
    
        //START GET AGE
        getAge : function getAge(){

            //Tell me your age!
            textArea("Zadej svůj věk!");
            
            $('#inputs').keypress(function (e){
                if (e.which == 13){
                    Player.age = $("#inputs").val();
                    textArea("\n" + Player.age + "\n");
                    clearInput();
                    functions.getSex();
                }
            });
        },
        //END GET AGE
        
        getSex : function getSex(){
 
            //Tell me your sex: male/female
            textArea("Zadej pohlaví: muž/žena");
            
            $('#inputs').keypress(function (e){
               if (e.which == 13){
                   Player.sex = $('#inputs').val();
                   textArea("\n" + Player.sex + "\n");
                   clearInput();
                   //Another function
               } 
            });
        }
    };
    
    functions.start();
});

#content>*{
    display: block;
    margin: 0 auto ;
}
#textArea{
    box-shadow: 2px 2px 2px grey;
    background: black;
    color: white;
}
#inputs{
    width: 61%;
    margin-top: 10px;
    background: black;
    color: white;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="script.js"></script>
</head>
<body>
    <div id="content">
        <textarea id="textArea" rows="30" cols="100"></textarea>    
        <input type="text" id="inputs">
    </div>
</body>
</html>

为什么当我一个接一个地调用函数时，它会调用之前的所有内容？

0 个答案: