Question

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

班级是这样的：

function Popup()
{
}

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

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

    return _response
}

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

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
}

但不起作用（如我所料）

然后，我该如何等待用户点击？

感谢所有

Answer 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/

Answer 2

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

一旦您将回调注册到click事件，程序就会继续执行。脚本中的以下行

    _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();
  }
}

Answer 3

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

重复

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

等待用户事件

3 个答案: