Javascript 中的模态阻止对话框

发布于 2024-12-05 17:02:19 字数 797 浏览 8 评论 0原文

我正在使用 jQuery 和 jQuery UI 在 Javascript 中开发 Openlayers 工具栏。

我想要实现的一项功能是向地图添加点。

在 openLayers 中,您必须监听名为“sketchcomplete”的事件。

layer.events.on({
    'sketchcomplete': onPointAdded
});

问题出在 onPointAdded 回调中。此回调应返回 true 或 false。 True 表示该点应添加到地图中, false 表示取消将此点添加到地图中。

现在回调看起来像这样:

onPointAdded = function(feature) {
  var f = feature.feature;
  var result = false;
  $('#dialog-point-add').dialog({
    modal : true,
    buttons : {
      'Add point' : function() {
        result = true;
        $(this).dialog("close");
      },
      'Cancel' : function() {
        result = false;
        $(this).dialog("close");
      }
    }
  });
  return result;
};

问题是这个对话框不会阻止执行代码。请问您遇到这种情况该如何处理?我想向用户显示对话框,并确认添加点。

I'm developing Openlayers toolbar in Javascript with jQuery and jQuery UI.

One feature that I want to implement is Adding points to the map.

In openLayers you have to listen for event called 'sketchcomplete'.

layer.events.on({
    'sketchcomplete': onPointAdded
});

The problem is in onPointAdded callback. This callback should return true or false. True mean that the point should be added to the map and false means cancel adding this point to the map.

Now the callback looks like this:

onPointAdded = function(feature) {
  var f = feature.feature;
  var result = false;
  $('#dialog-point-add').dialog({
    modal : true,
    buttons : {
      'Add point' : function() {
        result = true;
        $(this).dialog("close");
      },
      'Cancel' : function() {
        result = false;
        $(this).dialog("close");
      }
    }
  });
  return result;
};

The problem is that this dialog doesn't block the executing code. I'm asking You How to handle this situation? I want to show dialog to the user with confirmation for adding the point.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

小瓶盖 2024-12-12 17:02:19

如果我正确理解这个问题,您将无法使用 jquery ui 对话框执行此操作。普通的 js 确认框应该可以工作。

If I understand the question correctly, you are not going to be able to do this with the jquery ui dialog. The vanilla js confirm box should work though.

李白 2024-12-12 17:02:19

该函数不能阻塞,因为 JavaScript 是单线程的,不能执行其他任何操作。为什么不将函数返回 true 时要调用的逻辑添加到“添加点”回调中?

编辑:
“正常”的 JavaScript 确认对话框会被阻止:

onPointAdded = function(feature) {
  return confirm("Sure?");
};

The function can not block, because JavaScript is single threaded and nothing else could be executed. Why don't you just add the logic, you want to call if the the function returns true, to the 'Add point' callback?

EDIT:
a "normal" JavaScript confirm dialog would block:

onPointAdded = function(feature) {
  return confirm("Sure?");
};
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文