Javascript/JQuery 等待用户输入

Question

我正在开发使用 Javascript 和 JQuery 制作的基于文本的浏览器游戏。 我遇到了用户输入的问题。 我以前所做的只是使用prompt()因为它易于使用，允许我将输入保存到变量并使代码等待输入。

现在我想让它看起来更好，所以我在它上面有一个漂亮的聊天框，我自己制作了输入字段。 我想知道的是如何在用户按下 Enter 之前停止执行代码（我已经检测到按下 Enter 并且文本被附加到对话框中，我只需要代码在它之前等待它发生继续）。

这是我的一些代码：

输入功能

function input_field() {
    var inputField = $('#dialog-input');
    var messageField = $('#dialog-text');

    inputField.keyup(function (e) {
        if (e.keyCode == 13) {
            window.userInput = inputField.val();
            if(userInput != '') {
                messageField.append('You: ' + window.userInput + '<br>');
                inputField.val('');
                messageField.scrollTop(999999999);
            }
        }
    });
}

我想要做的就是将数据保存到一个变量中，然后像使用prompt()一样使用 switch-case 对其进行检查，但就目前而言，它只会给我一个错误，因为它试图执行所有代码而不是等到用户给出输入。

Answer 1

异步+等待是可能的。

请注意，目前并非所有浏览器（ http://caniuse.com/#search=await ）都完全支持它，并且可能有更好的解决方案来解决此类问题。

使用await myAsyncFunction()使浏览器将函数视为同步，因此它停止进一步执行此函数，直到等待的函数返回结果。 它不会阻止网站上的其他代码运行。

await只能在async function ，否则浏览器会抛出错误。

这是一个示例，显示如何使用 await+async 等待用户输入：

 async function handleForm() { let userInput = ''; console.log('Before getting the user input: ', userInput); userInput = await getUserInput(); console.log('After getting user input: ', userInput); }; function getUserInput() { return new Promise((resolve, reject) => { $('#myInput').keydown(function(e) { if (e.keyCode == 13) { const inputVal = $(this).val(); resolve(inputVal); } }); }); }; handleForm();

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="myInput">

Answer 2

您必须采取不同的方式，而 javascript 在使用 prompt() 时会停止并等待返回值，但您无法使用自定义提示直接实现这一点。

var result = [];
for(var i = 0; i > 5; i--){
    result.push( prompt('tip something') ); // Ok
};

javascript 将中断，直到提示返回某些内容

但是你不能告诉你的代码停止，就像浏览器在提示时所做的那样。 在关闭打开/更新下一个模式的模式（单击按钮或按键时）时，您必须执行代码。