ASP.NET WebForms中JS函数仅IE生效，Edge/Chrome失效求助

window.showModalDialog是IE专属的非标准JavaScript API，Chrome、Edge（Chromium内核）等现代浏览器早已移除了对该方法的支持，这就是切换到Edge后功能失效的核心原因。

以下是几种适配现代浏览器的替代方案，可根据项目情况选择：

方案1：HTML5原生<dialog>元素（推荐） #

利用现代浏览器原生支持的<dialog>元素实现模态窗口，配合iframe加载目标页面：

1. 在主页面添加dialog结构：

<dialog id="pharmacyDialog" style="width:800px; height:600px; border: none; padding: 0;">
  <iframe src="search_pharmacy.aspx" width="100%" height="100%" frameborder="0"></iframe>
</dialog>

2. 修改主页面的ChoosePharmacy函数：

function ChoosePharmacy() {
  const dialog = document.getElementById('pharmacyDialog');
  dialog.showModal();

  // 监听对话框关闭事件，获取返回值
  dialog.addEventListener('close', () => {
    if (dialog.returnValue) {
      document.getElementById('hIdPharmacy').value = dialog.returnValue;
    }
  }, { once: true });
}

3. 在search_pharmacy.aspx中，完成选择后关闭对话框并传递结果：

// 假设selectedId是用户选中的药房ID
window.parent.document.getElementById('pharmacyDialog').close(selectedId);

方案2：window.open模拟模态效果 #

如果需要兼容较老浏览器，可使用window.open配合定时检查实现：

function ChoosePharmacy() {
  const childWin = window.open('search_pharmacy.aspx', '_blank', 'width=800,height=600,scrollbars=no,resizable=no');
  
  // 定时检查子窗口是否关闭
  const checkTimer = setInterval(() => {
    if (childWin.closed) {
      clearInterval(checkTimer);
      if (childWin.returnValue) {
        document.getElementById('hIdPharmacy').value = childWin.returnValue;
      }
    }
  }, 100);
}

在search_pharmacy.aspx中完成选择后：

window.returnValue = selectedId; // 传递选中的ID
window.close();

方案3：使用前端组件库（如Bootstrap）模态框 #

若项目已引入Bootstrap，可利用其模态框组件加载iframe：

1. 主页面添加Bootstrap模态框结构：

<div class="modal fade" id="pharmacyModal" tabindex="-1" aria-labelledby="pharmacyModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <iframe src="search_pharmacy.aspx" width="100%" height="600px" frameborder="0"></iframe>
    </div>
  </div>
</div>

2. 主页面修改ChoosePharmacy函数：

function ChoosePharmacy() {
  const modal = new bootstrap.Modal(document.getElementById('pharmacyModal'));
  modal.show();
}

// 用于接收子页面传递的结果
function setPharmacyId(id) {
  document.getElementById('hIdPharmacy').value = id;
  const modal = bootstrap.Modal.getInstance(document.getElementById('pharmacyModal'));
  modal.hide();
}

3. 在search_pharmacy.aspx中完成选择后调用父页面方法：

window.parent.setPharmacyId(selectedId);

内容的提问来源于stack exchange，提问作者Ciupaz