window.alert / window.confirm期间的鼠标事件

Question

因此，我有一个自定义的拖动方法，由mousedown, mouseup and mousemove事件组成，像这样。 我的方法是move()

$(document).on('mousedown', function() {drag = true });
$(document).on('mouseup', function() {drag = false });
$(document).on('mousemove', function() { if (drag) move() });

一切都很好，但是可以想象一下move()声明：

function move() {
  confirm('Do you blablabla...?');
}

现在的顺序是这样的：

1. 我点击文件
2. 我移动鼠标
3. 我得到一个确认模式框
4. 我单击确定/取消
5. 我移动鼠标
6. 我得到一个确认模式框

尽管我释放了鼠标按钮，但仍得到确认模式框。 原来，在显示模式框时没有报告任何事件。

我的问题-如何解决这个问题？

我虽然只有一种可能的解决方案-使用自定义模式框（例如jQuery UI Modal）覆盖window.alert / window.confirm，但在这种情况下，我想保留默认值，并且应用程序已经足够成熟，因此用户习惯了默认外观模态。

我如何修复它？

我这样做：

  var _alert = window.alert;
  var _confirm = window.confirm;

  window.alert = function() {
    drag = false;
    return _alert.apply(this, arguments);
  }

  window.confirm = function() {
    drag = false;
    return _confirm.apply(this, arguments);
  }

而且它对我几乎没有任何新的错误的工作。 我将不胜感激对此解决方案的任何暗示。

Answer 1

模态将导致事件停止，因为您不再单击页面/正文。

最好的解决方案是您自己的带有样式的滚动对话框。

尝试http://jqueryui.com/dialog/

Answer 2

我已经用非常简单的代码解决了我的问题。 尽管担心修改原始方法，但我还是尝试保留原始方法。

一旦显示了模态或警报，代码只需将拖动标志设置为false。

  var _alert = window.alert;
  var _confirm = window.confirm;

  window.alert = function() {
    drag = false;
    return _alert.apply(this, arguments);
  }

  window.confirm = function() {
    drag = false;
    return _confirm.apply(this, arguments);
  }