Javascript 暂停功能,直到按下回车键

Javascript 暂停功能,直到按下回车键,javascript,function,Javascript,Function,javascript的新特性。我知道这可能很简单,但我想不出来。我想执行一个函数。在函数中间暂停并等待用户点击“输入”键,该键将允许函数再次继续(或将调用另一个函数来启动)。 我将创建一个全局变量来查看javascript是否正在等待按键 在脚本的顶部,您可以添加 var waitingForEnter = false; 然后在函数中将其设置为true function appear() { document.getElementById("firstt").style.visibi

javascript的新特性。我知道这可能很简单,但我想不出来。我想执行一个函数。在函数中间暂停并等待用户点击“输入”键,该键将允许函数再次继续(或将调用另一个函数来启动)。
我将创建一个全局变量来查看javascript是否正在等待按键

在脚本的顶部,您可以添加

var waitingForEnter = false;
然后在函数中将其设置为true

function appear()
{
     document.getElementById("firstt").style.visibility="visible";
     waitingForEnter = true;
}
然后…为enter键添加一个侦听器

function keydownHandler(e) {

    if (e.keyCode == 13 && waitingForEnter) {  // 13 is the enter key
        document.getElementById("startrouter").style.visibility="visible";
        waitingForEnter = false; // reset variable
    }
}

// register your handler method for the keydown event
if (document.addEventListener) {
    document.addEventListener('keydown', keydownHandler, false);
}
else if (document.attachEvent) {
    document.attachEvent('onkeydown', keydownHandler);
}

我希望这有帮助。这正是我要做的,它可能不是最好的方法。

或者我们可以从Javalsu内联解决方案,并去掉全局变量

function appear(){
    document.getElementById("firstt").style.visibility="visible";
    //here is where I want the pause to happen until the user presses "enter" key
    function after(){
        //Below is what I want to happen after the "enter" key has been pressed.
        document.getElementById("startrouter").style.visibility="visible";
    }
    function keydownHandler(e) {
        if (e.keyCode == 13 && waitingForEnter) {  // 13 is the enter key
            after();
        }
    }
    // register your handler method for the keydown event
    if (document.addEventListener) {
        document.addEventListener('keydown', keydownHandler, false);
    }
    else if (document.attachEvent) {
        document.attachEvent('onkeydown', keydownHandler);
    }
}

更新2020

这可以通过承诺(ES2015)异步/等待(ES2017)轻松实现

  • 在这里,我们使用async/wait暂停执行并等待承诺实现:

    async function test() {
      console.log('waiting keypress..')
      await waitingKeypress();
      console.log('good job!')
    }
    
  • 在效用函数中,我们立即返回一个承诺,但是测试函数的等待解析被调用:

    function waitingKeypress() {
      return new Promise((resolve) => {
        document.addEventListener('keydown', onKeyHandler);
        function onKeyHandler(e) {
          if (e.keyCode === 13) {
            document.removeEventListener('keydown', onKeyHandler);
            resolve();
          }
        }
      });
    }
    

  • 奖金回合

    通过等待承诺的模式,我们还可以编写一个等待x秒然后继续执行的函数:

    function delay(ms) {
      return new Promise((resolve) => setTimeout(resolve, ms));
    }
    
    这将等待1秒:

    async function test() {
       await delay(1000);
       // Goes on after 1 second
    }
    

    wait表达式导致异步函数执行暂停,直到一个承诺得到解决,并在实现后恢复异步函数的执行

    承诺是在创建承诺时不一定知道的值的代理。它允许您将处理程序与异步操作的最终成功值或失败原因相关联


    不行。对不起,可以。只是没有一种方法。您必须将此函数分成几个部分,并从事件处理程序中为回车键执行延迟代码。@NickRoth yep。然而,这并不是“暂停一个方法”;-)有点相关:您似乎没有实际使用
    waitingForEnter
    ,是的,我更愿意使用jQuery进行处理程序绑定:-),我也会这样做,但没有“jQuery”标记。答案是用javascript请求的。
    async function test() {
       await delay(1000);
       // Goes on after 1 second
    }