Chrome不支持showModalDialog的替代方案

"在Chrome浏览器升级到特定版本后，showModalDialog模态对话框功能不再被支持，导致一些依赖此功能的项目无法正常运行。本文介绍了一种利用window.open替代showModalDialog的方法，并通过window.opener.document来实现与父页面的交互，从而达到类似的效果。" 在Web开发中，`showModalDialog`是一个非常有用的JavaScript API，它能够打开一个模态窗口，用户必须关闭这个窗口才能继续与主窗口交互。然而，随着时间的推移和浏览器标准的更新，谷歌浏览器（Chrome）逐步弃用了`showModalDialog`，特别是在版本37.0.2062.103 m之后，这个API不再被支持，且无法返回`returnValue`，这给使用此功能的开发者带来了困扰。 为了解决这个问题，开发者们寻找了替代方案。一种可行的方法是使用`window.open`函数来创建一个新的非模态窗口，然后通过`window.opener`属性来引用并操作父窗口的元素。尽管这不是严格意义上的模态对话框，但可以模拟出相似的行为，尤其是在不允许用户在子窗口操作时完成特定任务的场景。 下面是一个示例代码片段，展示了如何使用`window.open`替代`showModalDialog`： ```javascript // 打开一个新窗口，参数包括URL、窗口名称以及窗口特性（如尺寸、工具栏等） var newWindow = window.open("xsp/exesp?todo=13", "", "height=500,width=280,status=yes,toolbar=no,menubar=no,location=no"); ``` 在新窗口完成其任务后，可以通过`window.close()`关闭窗口，并利用`window.opener.document`来访问和修改父窗口中的元素，例如： ```javascript // 关闭新窗口 newWindow.close(); // 修改父窗口中指定ID元素的值 window.opener.document.getElementById("classid").value = treeid; window.opener.document.getElementById("classname").value = treename; ``` 这种方法虽然没有`showModalDialog`那样直接，但可以满足类似的需求。需要注意的是，由于涉及到跨窗口操作，可能受到同源策略的限制，只有当新窗口和父窗口同源时，这种技术才有效。同时，由于使用非模态窗口，用户体验可能会有所不同，因为用户可能在子窗口打开时继续与主窗口交互。 随着浏览器的发展，开发者需要时刻关注API的更新和弃用情况，及时调整代码以保持兼容性。对于依赖特定功能的项目，可以考虑使用polyfill库或者寻找其他跨浏览器的解决方案。