Javascript 暂停函数执行，直到另一个函数返回

我想替换Magento对alert（）和confirm（）对话框的实现。虽然alert（）的替换非常简单，但我不确定如何处理confirm（）对话框。有没有办法阻止JavaScript在函数返回之前继续运行？这是否需要可能导致浏览器崩溃的循环

例如，我需要这样替换代码：

<form action="" method="POST">
   <input type="submit" onclick="return confirm('Are you sure?');" value="Delete">
</form>

与

<form action="" method="POST">
   <input type="submit" onclick="return myCustomConfirm('Are you sure?');" value="Delete">
</form>

<script>
   var delete = myCustomConfirm('Are you sure?');
   if (delete) {
       doSomething();
   }
</script>

或其他情况，例如：

<script>
   var delete = confirm('Are you sure?');
   if (delete) {
       doSomething();
   }
</script>

var delete=confirm（'您确定吗？'）；
如果（删除）{
doSomething（）；
}

与

<form action="" method="POST">
   <input type="submit" onclick="return myCustomConfirm('Are you sure?');" value="Delete">
</form>

<script>
   var delete = myCustomConfirm('Are you sure?');
   if (delete) {
       doSomething();
   }
</script>

var delete=myCustomConfirm（'您确定吗？'）；
如果（删除）{
doSomething（）；
}

在这两种情况下，myCustomConfirm（）将打开一个引导模式，用户必须单击“确定”、“取消”或关闭该模式。如果值为“OK”，则返回true；否则返回false

我不想做回调，因为那样会导致更多的重构。这是否可以用另一种方式实现

---

谢谢

只需让您的按钮打开引导模式，并向“确定”和“关闭”按钮添加事件侦听器即可

    <!-- Simple popup sample from Bootstrap.com: Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal" id="hide_popup">Close</button>
        <button type="button" class="btn btn-primary" id="save_stuff">Save changes</button>
      </div>
    </div>
  </div>
</div>

---

这是不可能的。不能编写阻止执行、收集用户输入并基于用户输入返回值的JavaScript函数。阻止执行并等待用户输入的唯一方法是使用

confirm

如果要使用自定义对话框，必须重构代码以使用回调

---

请参见

您可以使用ES7中的async/await执行类似的操作

async function stepTwo()
{
  return new Promise((resolve) =>
  {
    let stop = false;
    $('input[type=checkbox]').one('change', (event) =>
    {
      // Will only stop the loop when the checkbox is checked
      if (event.target.checked === true)
      {
        stop = true;
      }
    });
    loop();

    // Continues looping until stop is set to true (i.e. input has been done)
    function loop()
    {
      if (stop === true)
      {
        resolve();
        return;
      }

      // Keeps checking if stop is true
      setTimeout(loop, 100);
    }
  });
}

async function stepOne()
{
  $('div').text('Waiting for input..');
  // Waits for promise returned from stepTwo() to resolve
  await stepTwo();
  $('div').text('Input checked!');
}

// Starts the async function (any lines below this continue execution)
stepOne();

---

Fiddle:

delete

是一个变量名，所以不要将其用作变量名。不，没有办法。您需要对异步代码使用回调，这是不可避免的。你可以通过以下方式最小化重构，但任何控制结构都需要重构。OP说他们不想使用回调？为了完整性，

alert

和

prompt

也“阻止执行”，尽管它们实际上只是

confirm

的变体