iframe window.close() 安卓可以关闭iframe iso 关闭整个父页面并返回，怎么兼容

在 Android 系统中，可以使用 `window.close()` 关闭 iframe 窗口，但是在 iOS 系统中，不能直接关闭 iframe 窗口，需要通过父页面进行关闭。因此，为了兼容 Android 和 iOS 系统，可以使用以下代码：

if (/Android/i.test(navigator.userAgent)) {
  window.close(); // 关闭 iframe 窗口
} else if (/iPhone|iPad|iPod/i.test(navigator.userAgent)) {
  if (window.parent && window.parent != window) {
    window.parent.location.href = "about:blank"; // 关闭父页面并返回
  }
}

这段代码会先判断用户的设备类型，如果是 Android 系统，则直接关闭 iframe 窗口；如果是 iOS 系统，则判断当前窗口是否嵌套在父页面中，如果是，则将父页面的 URL 设置为 "about:blank"，从而关闭父页面并返回。

相关问题

const print = () => { if (!baseInfo.orderCode) { message.error("打印正在准备，请5秒后再点击") return } const el = document.getElementById("print-container") const iframe = document.createElement("IFRAME") let doc = null // iframe.setAttribute('style', 'position:absolute;top:0px;left:0px;width:100%;height:100%',); document.body.appendChild(iframe) doc = iframe.contentWindow.document // 引入打印的专有CSS样式，根据实际修改 doc.write(`<LINK rel="stylesheet" type="text/css" href="./orderPrint.css">`) doc.write(el.innerHTML) doc.close() // 获取iframe的焦点，从iframe开始打印 iframe.contentWindow.focus() iframe.onload = () => { iframe.contentWindow.print() document.body.removeChild(iframe) } if (navigator.userAgent.indexOf("MSIE") > 0) { document.body.removeChild(iframe) } const old = window.document.body.innerHTML const printPart = document.getElementById("print-container") window.document.body.innerHTML = "" window.document.body.appendChild(printPart) window.print() window.document.body.innerHTML = old window.location.reload() }优化这段代码

这段代码可以进行如下的优化：

1. 避免在函数内部操作 DOM，最好将其作为参数传递进来，这样可以提高代码的可重用性和可维护性。

const print = (elId, cssUrl) => {
  const el = document.getElementById(elId)
  if (!el) {
    message.error("找不到打印内容，请检查elId")
    return
  }
  if (!baseInfo.orderCode) {
    message.error("打印正在准备，请5秒后再点击")
    return
  }
  const iframe = document.createElement("IFRAME")
  document.body.appendChild(iframe)
  const doc = iframe.contentWindow.document
  doc.write(`<LINK rel="stylesheet" type="text/css" href="${cssUrl}">`)
  doc.write(el.innerHTML)
  doc.close()
  iframe.contentWindow.focus()
  iframe.onload = () => {
    iframe.contentWindow.print()
    document.body.removeChild(iframe)
  }
  if (navigator.userAgent.indexOf("MSIE") > 0) {
    document.body.removeChild(iframe)
  }
}

2. 将打印的专有CSS样式和打印的内容分开处理，以便更好地维护和修改样式。

const print = (elId, cssUrl, printContent) => {
  const el = document.getElementById(elId)
  if (!el) {
    message.error("找不到打印内容，请检查elId")
    return
  }
  if (!baseInfo.orderCode) {
    message.error("打印正在准备，请5秒后再点击")
    return
  }
  const iframe = document.createElement("IFRAME")
  document.body.appendChild(iframe)
  const doc = iframe.contentWindow.document
  const link = document.createElement("link")
  link.rel = "stylesheet"
  link.type = "text/css"
  link.href = cssUrl
  doc.head.appendChild(link)
  doc.body.innerHTML = printContent || el.innerHTML
  iframe.contentWindow.focus()
  iframe.onload = () => {
    iframe.contentWindow.print()
    document.body.removeChild(iframe)
  }
  if (navigator.userAgent.indexOf("MSIE") > 0) {
    document.body.removeChild(iframe)
  }
}

3. 将打印内容从 DOM 中分离出来，以便在不同的场合下方便地调用。

const printContent = (elId) => {
  const el = document.getElementById(elId)
  if (!el) {
    message.error("找不到打印内容，请检查elId")
    return ""
  }
  return el.innerHTML
}

const print = (elId, cssUrl, printContent) => {
  if (!baseInfo.orderCode) {
    message.error("打印正在准备，请5秒后再点击")
    return
  }
  const iframe = document.createElement("IFRAME")
  document.body.appendChild(iframe)
  const doc = iframe.contentWindow.document
  const link = document.createElement("link")
  link.rel = "stylesheet"
  link.type = "text/css"
  link.href = cssUrl
  doc.head.appendChild(link)
  doc.body.innerHTML = printContent || printContent(elId)
  iframe.contentWindow.focus()
  iframe.onload = () => {
    iframe.contentWindow.print()
    document.body.removeChild(iframe)
  }
  if (navigator.userAgent.indexOf("MSIE") > 0) {
    document.body.removeChild(iframe)
  }
}

window.close的替换

在Web页面中，使用window.close()可以关闭当前窗口。但是，由于安全原因，现代浏览器可能会阻止此操作。为了更好地控制窗口的关闭行为，可以使用以下方法替换window.close()：

1. 使用window.open()打开一个新窗口，并在其中运行JavaScript代码来关闭当前窗口：

window.open('','_self').close();

2. 在窗口中嵌入一个iframe，然后使用JavaScript代码来关闭该iframe，从而关闭整个窗口：

<iframe id="closeFrame" src="about:blank"></iframe>
<script>
document.getElementById('closeFrame').contentWindow.close();
</script>

请注意，这些替代方案可能不适用于所有情况，并且在某些浏览器中仍然可能被阻止。建议在使用这些方法之前，仔细评估您的需求和环境，并进行充分测试。