javascript - JS模态窗口(弹出窗口)之间的通信

Question

您认为 MODAL A 和 MODAL B 之间通信的最佳方式(或某些方式)是什么？ - 它们不同时存在。一个打开另一个。

<小时/>

---

需要发生什么:

(在这个非常具体的情况下，但有很多情况)

MODAL A触发(打开)MODAL B，其中用户从列表中选择事物，然后在申请后，他将被发送回MODAL A(基本上是触发当前模态的最后一个模态)，现在MODAL A需要显示从MODAL B中选择的数据.

将数据从 B 传递到 A 的方式:

• 使用某种临时本地存储或某种共享内存对象，MODAL A 在启动时始终会检查并执行操作(然后清除它)。该对象将始终存储另一个弹出窗口中可能需要的任何数据，并且如果某个弹出窗口需要与另一个弹出窗口相关的数据，则该弹出窗口将知道检查该对象是否有其需要的内容。

• MODAL B 会将一些数据直接传递到它应该通过一些数据打开的 MODAL，这些数据将附加到打开回调的按钮，顺便说一句，它看起来像这样:
  <a data-modal="lastModal">Continue</a>

你还有其他想法吗？也许更好？

---

更新

最后我所做的是将关闭的模态窗口(触发 MODAL B 的窗口)存储在内存中，并使用自定义事件来发布 MODAL A 的 Controller 将订阅的任何数据，并将更改相应地查看它，而 DOM 位于内存中，因此一旦从我的模态历史数组中恢复 MODAL A，它就已经被更新了。一所有模态都关闭，历史对象被清除。

Answer 1

这已在其他 GUI 平台上使用事件解决。您可以广播数据以供其他区域接收，这样您就可以扩展模态实例，而无需让它们依赖于硬编码键或对象文字。

当单击应用按钮时，模态 A 可以监听事件 modal.capture-data，而模态 B 可以发出事件 modal.capture-data。

现在，当您向其中添加更多模式时，您可能需要添加一些凭据检查或特定事件来确定何时应用收到的数据。

还有大量处理自定义事件的 JS 库:jQuery、Angular(基于 $scope/$rootScope)或 EventEmitter。