Question

我正在渲染一个动态创建iframe作为页面一部分的页面。内容在创建时在iframe中呈现。我也有一个链接＆＃34;目标＆＃34;用于呈现其他页面的iframe。

在iframe中呈现的代码会动态加载javascript。但是，当您单击以iframe名称为目标的链接时，将创建一个新窗口，而不是iframe中的内容呈现，就像target =＆＃34; blank＆＃34;一样。如果我注释掉javascript的动态加载，则链接目标=每次都正常工作。

据我所知，我正在正确地进行动态加载。 js代码加载并正确执行。但是，我不确定DOM会对目标造成什么影响。任何帮助将不胜感激。

page1.html：

    <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
    <script type="text/javascript">
      var ifr = "<iframe width='998' name='main'
         id='main' src='page2.html' scrolling='no'
         frameborder='1'  height='100'></iframe>";
      $(document).ready(function() {
        $("#content").html(ifr);  
          $('iframe').load(function() {
             this.style.height = 
              this.contentWindow.document.body.offsetHeight + 60 + 'px';
          });
      });
    </script>
   <body>
    <div id="wrapper" style="height: 100px;">
      <p><a href="index1_mgc1.html" target="main">Click Me</a></p>
      <div id="content">
      </div>
    </div>
   </body>

page2.html：

   <script type="text/javascript">
  // var ScriptLoaded = true; 
  if (typeof ScriptLoaded == 'undefined') {
      var scripts = ["js/jquery-1.6.2.min.js"];
      for (i=0; i<scripts.length; i++) {
        var name = scripts[i];
        loadScript(name, function() {
        });
      }
   };

   window.onload = waitForLoad();

   function loadScript(name,callback) {
       var script = document.createElement('script');
       script.type = "text/javascript";
       if (script.readyState) {  // IE
          script.onreadystatechange = function () {
             if (script.readyState == "loaded" ||
                  script.readyState == "completed") {
                script.onreadystatechange = null;
                callback();
             }
          }
       } else {      // Other
         script.onload = function() {
           callback();
         }
       }
       script.src = scripts[i];
       document.getElementsByTagName("head")[0].appendChild(script);
  };
  function waitForLoad() {
    if (typeof jQuery == "undefined") {
       setTimeout(waitForLoad,500);
    }
  };
</script>
<body>
<div class="page">
  this is in an iframe
</div>

Answer 1

我已经找了一个自然的解决方案，但似乎没有。

当动态创建iframe时，

target="someIframe"不喜欢它。以下是您在创建iframe后可以放置的解决方法：

$('a[target="main"]').click(function(ev){
    var src = $(this).attr('href');
    $('#main').attr('src', src);
    ev.preventDefault();
});

它会选择将iframe作为目标的每个链接，当您点击它们时，它会获得href，将其设置为iframe＆＃39; src，并阻止在新窗口中打开的链接。

动态加载javascript导致目标到iframe损坏

1 个答案: