等待用户事件[重复]答案

【问题标题】：Wait for a user event [duplicate]等待用户事件[重复]
【发布时间】：2013-10-30 19:36:57
【问题描述】：

我正在开发一个 javascript 类（使用 jQuery）来创建自定义弹出窗口，但我不知道如何“暂停”脚本以等待用户响应（单击 OK 按钮或取消）

类是这样的：

function Popup()
{
}

Popup.Show = function(text)
{
    var _response;
    /* code to draw the popup elements*/

    $("#button-ok").on("click",function()
    {
        _response = "ok!"
    }

    return _response
}

例如，如果在警报中使用它，该方法总是返回“未定义”，因为它不等待用户点击

alert(Popup.Show("hello"))
//return undefined before the popup appears

我尝试使用这样的 while 循环：

Popup.Show = function(text)
{
    var _response;
    var _wait = true;

    /* code to draw the window */

    $("#button-ok").on("click",function()
    {
        _wait = false;
        _response = "ok!"
    }

    while(_wait){};

    return _response
}

但不起作用（如我所料）

那么，如何等待用户点击呢？

谢谢大家

【问题讨论】：

标签： javascript jquery events popup wait

【解决方案1】：

这是一个典型的 JavaScript 问题。

$("#button-ok").on("click",function()
{
    _response = "ok!"
}

return _response

现在让我们看看这里发生了什么。您正在为按钮设置一个 onClick 侦听器，并为该事件分配一个回调函数。将该函数视为您传递给另一个函数的参数。它不是直接执行的。

现在，与其使用 while(_wait){}; 之类的东西并强制它同步执行，不如使用该回调。

 Popup.Show = function(text)
 {

    $("#button-ok").on("click",function()
    {
           drawSomething('ok');
    }

 };

var drawSomthing = function(response) {
 // do something
 };

这是回调的一个很好的开始：http://javascriptissexy.com/

【讨论】：

谢谢，但真正的问题是在返回值之前等待用户事件。我该怎么办？
这是不可能的，你必须重组你的代码，以利用回调。像这样：link

【解决方案2】：

JavaScript 是异步的，您不能“暂停”执行。此外，当 javascript 运行时，整个用户界面冻结，因此用户无法单击按钮。

一旦您注册了点击事件的回调，程序就会继续执行。脚本中的以下几行

    _wait = false;
    _response = "ok!"

在Popup.Show 函数返回之前永远不会被执行。也许this Nettuts article about javascript event programming 会帮助你理解范式。

这是修复代码的尝试：

Popup.Show = function(text)
{
  /* code to draw the window */

  // bind click event
  var myPopup = this;
  $("#button-ok").on("click",function()
  {
    // this code will be executed after Popup.Show has return
    myPopup.response = "ok!"
    myPopup.Close();
  }
}

【讨论】：

是的，我知道事件是异步的，问题正是这个。解决这个问题并确保函数返回用户响应的解决方案是什么？
这不可能。该函数将在用户单击按钮之前始终返回。您必须更改代码以考虑到这一点。
所以我不能复制这个：alert(prompt())?在这种情况下 prompt() 是否等待用户确认？
JavaScript 不是异步的； JavaScript 中有一些函数，例如创建异步行为的 AJAX 调用，但基础语言本身是同步的。

【解决方案3】：

您正在尝试做的事情的背景以及为什么有点模糊，因为您似乎正在尝试重建“警报”功能。但是'alert'是一个由浏览器设置的窗口功能。这个问题似乎与Stop page execution like the alert() function 重复

基本上讲的是回调链，本质上是封装功能，以便您可以强制执行它们的运行顺序。我还认为您对代码的运行方式存在根本性的误解。正如所讨论的事件处理程序是异步的，并且在按顺序读取代码时，它不会运行在事件处理程序回调中设置的函数，直到该事件被触发。

【讨论】：