从iframe页面事件更改父级的css

Question

我有一个包含middle_overlay div的homepage ，该页面最初不可见。此外，它还包含“ iframe capture ”，页面上有单击按钮，在按钮单击事件中，我想使middle_overlay div可见，但是我可以从另一个页面更改我该如何更改改变CSS？

HTML：

<div id="middle_overlay">
</div>

<div id="middle">
    <iframe id="middle_frame" src="capture.php" frameborder='0' border='0' style="border:0;" seamless>
    </iframe>
</div> 

jQuery ::

$(document).ready(function()
{
$('#Monthly_Report').click(function(){
alert('monthly report clicked');
$('#middle_overlay').css('display','block');                                

});



});

Answer 1

window.parent.$('#middle_overlay').css('display','block'); 

请注意，这仅在您的iframe和父页面来自同一域时才有效。

Answer 2

您也可以尝试使用此jquery解决方案：

$("#middle_frame").contents().find('#Monthly_Report').click(function(e){
    e.preventDefault();
    $('#middle_overlay').show();
});

Answer 3

您已经找到答案，但是您可以参考此https://stackoverflow.com/a/19423398/1642219 ，以更清楚地了解您的问题