在进行Web开发时，模态窗口是一种常用的交互形式，用于实现数据的弹出编辑、添加等功能。在本场景中，我们有两个窗口，A窗口作为父窗口，B窗口作为模态窗口。用户在A窗口中点击一个按钮后，会弹出B窗口供用户操作。操作完成后，我们希望B窗口能自动关闭，并且触发A窗口的刷新。
我们来明确几个关键的技术点：
1. `window.showModalDialog`方法：这是在早期IE浏览器中用于弹出模态对话框的一个方法。该方法会创建一个新的模态窗口，显示指定的HTML内容，并且这个对话框是阻塞式的，即在关闭前用户不能与父窗口进行交互。
2. `window.opener`属性：这个属性用于获取打开当前窗口的父窗口对象。
3. `window.location.reload()`方法：此方法用于刷新调用它的窗口（无论是当前窗口还是父窗口）。
接下来，我们逐步解析具体实现方法：
### B窗口（模态窗口）的关闭与刷新A窗口（父窗口）
在B窗口中，当用户完成数据添加并提交后，可以通过JavaScript来关闭B窗口并刷新A窗口。一种常用的方法是在B窗口的提交处理函数中，使用`window.opener.location.reload();`来刷新父窗口。但是，在某些情况下，尤其是跨域环境下，`window.opener`可能返回null，导致此方法无效。这可能是因为浏览器的安全限制，阻止了跨域的父窗口的直接访问。
### 解决跨域限制问题
解决上述问题的一种方法是使用`window.opener.document.location.reload();`。但这样仍然可能会受到同源策略的限制，因此更可靠的做法是在A窗口中预留一个接口方法供B窗口调用。
### 避免缓存问题
在进行页面刷新时，为了避免浏览器缓存问题，我们通常会在URL后添加时间戳或者使用HTTP响应头控制缓存。在本例中，使用了`escape(new Date())`来为URL添加时间戳。此外，也可以在服务器响应时，设置相应的HTTP头（如`Cache-Control`）来控制缓存行为。
### 关于表单提交引发新窗口问题
有时候，我们在模态窗口中使用表单提交时，可能会遇到点击提交后会弹出一个新的窗口的问题。这通常是因为表单的`target`属性默认值是`_blank`。解决这个问题的一个简单方法是在模态窗口的`<head>`中，添加`<base target="_self">`。这样设置后，所有未指定`target`属性的`<a>`标签和表单的`target`属性默认值会变成`_self`，即在当前窗口中打开，而不是新窗口。
### 使用iframe替代弹出窗口
由于模态对话框在不同浏览器之间的兼容性问题，以及在某些JavaScript框架（如jQuery Mobile等）中已不再推荐使用`showModalDialog`，我们可以考虑使用`iframe`来作为模态窗口的替代方案。通过动态地将`iframe`内容设置为需要显示的HTML内容，并通过设置`iframe`的样式使其表现为模态窗口，可以避免很多兼容性问题。
### 总结
在实现模态窗口与父窗口交互的过程中，关键点包括模态窗口的创建和关闭、父窗口的刷新控制以及跨域安全限制的处理。为了实现无缝的用户体验，我们还需要注意避免缓存问题以及处理好表单提交时的新窗口弹出问题。虽然`window.showModalDialog`在某些场合仍有其用武之地，但在更多情况下，建议使用更为现代和兼容的`iframe`技术替代传统的模态对话框实现。
