Question

我有两个使用ajax调用的不同链接，不幸的是每个加载只能有一个请求。这将导致两个iframe显示相同的数据。我想知道如何通过这个？也许制作一个iframe加载，并在完成后进行下一个加载。我使用的代码在chrome上完美无缺！＆lt; 3但由于某种原因它被打破了Firefox：＆＃39;（

<script>
 function setIframeSrc2() {
  var inLink = "http://localhost";
  var graphic = document.getElementById('graphic');
  if ( -1 == navigator.userAgent.indexOf("MSIE") ) {
   graphic.src = inLink;
   } else if ( -1 == navigator.userAgent.indexOf("FireFox") ) {
   graphic.src = inLink;
   }
   else {
   graphic.location = inLink;
  }
 }
 setTimeout(setIframeSrc2, 0);

 iframe.contentWindow.location.reload(true);
 </script>


<script>
 function setIframeSrc() {
  var inLink2 = "http://localhost?loading";
  var graphic2 = document.getElementById('graphic2');
  if ( -1 == navigator.userAgent.indexOf("MSIE") ) {
   graphic2.src = inLink2;
  } else if ( -1 == navigator.userAgent.indexOf("FireFox") ) {
   graphic2.src = inLink2;
  }
   else {
    graphic2.location = inLink2;
   }
  }
 setTimeout(setIframeSrc, 7999);
</script>

对于html来说，它非常简单;

  <iframe frameborder="0" scrolling="no" width="100%" height="600" name="graphic" id="graphic">
       <p>iframes are not supported by your browser.</p>
    </iframe>

    <br />

    <iframe frameborder="0" scrolling="no" width="100%" height="600" name="graphic2" id="graphic2">
       <p>iframes are not supported by your browser.</p>
    </iframe>

或者是否可以使用jquery执行此操作？

Answer 1

听起来您应该在第一个load上等待<iframe>事件，然后在第二个src上设置<iframe>。

var frame1 = document.getElementById('graphic');
frame1.src = 'http://localhost';
frame1.addEventListener('load', loadFrame2);

function loadFrame2() {
    document.getElementById('graphic2').src = 'http://localhost?loading';
}

或者，因为你问过jQuery：

$('#graphic')
    .attr('src', 'http://localhost')
    .on('load', loadFrame2);

function loadFrame2() {
    $('#graphic2').attr('src', 'http://localhost?loading');
}

如何加载两个iframe，一个在第一个已加载之后？

1 个答案: