为什么当我调用一个又一个函数时，它调用的都是以前的

Why when I call function after another is completed, it calls all previous?

本文关键字：调用 一个又一个 函数 为什么      更新时间：2024-04-03

我想做一个基于控制台的文本游戏。当用户写下自己的名字时，它应该用年龄输入来调用函数，在年龄输入之后，它应该调用性别输入。但当我写年龄时，它会再次调用getAge+next函数。在下一个函数之后，它调用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>

每个函数调用都会向文本区域添加一个keypress侦听器。因此，在你的getAge()通话之后，你有两个听众。因此，下一次按键将调用getAge AND getSex。因此，一种解决方案是在设置新侦听器之前删除以前的侦听器。

相关文章：