如何使用jQuery处理iframe对象

我已经经历了很多与此问题相关的主题，但无法获得所需的输出。如何使用jQuery处理iframe对象

我里面和HTML调用一个IFRAME这样的：

<iframe class="full-screen-preview__frame" id="nitseditpreview" src="himu/index.php" name="preview-frame" frameborder="0" noresize="noresize" data-view="fullScreenPreview">

假设在这个iframe中我有一个类名像这样的H2标签：

<body> 
    <section id="about-us"> 
    <div class="container"> 
     <div class="text-center"> 
     <div class="col-sm-8"> 
      <h2 class="maincontent"> 
    Why with Us 
    </h2> 
     </div> 
     </div> 
    </div> 
    </section> 
</body>

所看到的检查在浏览器中的元素

通过使用jquery我想操纵这个让我们说例如我想在这个边框。我已经尝试了很多事情，但我想如果有人修复了这个bug这件事情会的工作，我的jQuery看起来是这样的：

$(document).load(function() { 
$('#nitseditpreview').load(function() { //The function below executes once the iframe has finished loading 
    $this = $(this); 
    $('#nitsmenu', this.contents()).css('border', 'solid 1px #777'); 
});

}）;

不知道我在做什么错误，即使我也遵循相同的原产地政策。

来源

2016-04-27 Nitish Kumar

是内部或外部的伊夫兰运行JS？ – Richard

iframe之外 –

如果框架和框架文档都在同一个域中，则不需要任何沙箱属性或CORS环箍跳跃。但也有其他一些错误的位置：

$(document).load(...)应该$(document).ready(...)
定义$this = $(this)，但随后在下一行尝试使用（因为它已经被你的脚本运行时加载）裸this
你试图匹配#nitsmenu不会出现在框架文件

以下似乎工作中存在的，虽然我很担心有可能仍然是在比赛条件是iframe的：

$(document).ready(function() { 
    $('#nitseditpreview').load(function() { 
     $(this).contents().find('.container').css('border', 'solid 1px #777'); 
    }); 
});

http://plnkr.co/edit/tCEHdU0ckg5q4w4tPVFU

来源

2016-04-27 13:07:14

嘿，感谢您的更新，但是这并没有帮助我..（ –

opps ..对不起，我忘了删除'sandbox =“allow-scripts”'。现在它的工作完美。吨..：） –

如何使用jQuery处理iframe对象

回答

相关问题