Wie verstecke ich alle IFrames in einer HTML-Seite, wenn die IFrame-Quelle XML-Fehler aufweist?
P粉308089080
P粉308089080 2024-01-10 17:33:29
0
1
423

Ich probiere es an iframe 标记内显示 PDF 预览时遇到问题。我有一个页面包含一些 iframes 以在页面中显示 PDF 文件,问题是有时源 URL 中不存在 PDF,因此 iframe 显示 XML 错误,指出 BlobNotFound。如果在 iframe 的源代码中返回该错误,我想隐藏 iframe.

Ich habe das folgende JavaScript-Skript ausprobiert:

<script>
  const myIframe = document.getElementById('myFrame1');
  fetch('example.xml')
      .then(response => {
          if (!response.ok) {
              throw new Error('XML file not found');
          }
          return response.text();
      })
      .then(xmlString => {
          const parser = new DOMParser();
          const xmlDoc = parser.parseFromString(xmlString, "text/xml");
          // check for errors in the XML content
          const error = xmlDoc.getElementsByTagName("parsererror");
          if (error.length > 0) {
              myIframe.style.display = 'none'; // hide the iframe if there is an error
          }
      })
      .catch(error => {
          console.error(error);
          myIframe.style.display = 'none'; // hide the iframe if there is an error
      });
</script>

Dieser Code funktioniert, aber nur, wenn du ihn per ID angibst iframe 标记,并且我想重写此代码以一次检查所有 iframe.

Ich habe auch den folgenden Code ausprobiert:

<script>
  const iframes = document.getElementsByTagName('iframe');
  for (let i = 0; i < iframes.length; i++) {
      const iframe = iframes[i];
      fetch(iframe.src)
          .then(response => {
              if (!response.ok) {
                  throw new Error('XML file not found');
              }
              return response.text();
          })
          .then(xmlString => {
              const parser = new DOMParser();
              const xmlDoc = parser.parseFromString(xmlString, "text/xml");
              // check for errors in the XML content
              const error = xmlDoc.getElementsByTagName("parsererror");
              if (error.length > 0) {
                  iframe.style.display = 'none'; // hide the iframe if there is an error
              }
          })
          .catch(error => {
              console.error(error);
              iframe.style.display = 'none'; // hide the iframe if there is an error
          });
  }
</script>

Dieser Code sollte funktionieren, aber irgendwie verbirgt er alle iframes, obwohl er keine Fehler enthält.

P.S. Dies ist ein XML-Fehler für alle iframe, die das PDF nicht anzeigen können.

<?xml version="1.0" encoding="utf-8"?>
<Error>
    <Code>BlobNotFound</Code>
    <Message>
        The specified blob does not exist.
            RequestId:xxxxxxxx
            Time:timestamp
    </Message>
</Error>

P粉308089080
P粉308089080

Antworte allen(1)
P粉043295337

你可以试试这个!

<!DOCTYPE html>
<html>
<head>
  <title>Hide Iframes with XML Error</title>
</head>
<body>
  <iframe src="path/to/pdf1.pdf"></iframe>
  <iframe src="path/to/pdf2.pdf"></iframe>
  <iframe src="path/to/nonexistent.pdf"></iframe>
  <iframe src="path/to/pdf3.pdf"></iframe>
  <script>
    var iframes = document.getElementsByTagName('iframe');
    for (var i = 0; i < iframes.length; i++) {
      var iframe = iframes[i];
      iframe.contentWindow.addEventListener('error', function(event) {
        if (event.message === 'BlobNotFound') {
          // Hide all iframes if any one of them has an XML error
          for (var j = 0; j < iframes.length; j++) {
            iframes[j].style.display = 'none';
          }
        }
      });
    }
  </script>
</body>
</html>

请告诉我它是否有效。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage