更改iframe src路径页面的背景

Question

我的网站上有这个HTML代码：

<iframe id="dado" src="other/maindome.html" width="100%" height="840px" frameBorder="0">
  Your browser doesn't load this iframe.
</iframe>

当我使用函数apri()时，我正确地更改了iframe src路径。

function apri(dat) {
document.getElementById('dado').src= dat;
}

页面other/maindome.html（例如）有一个名为bgframe2.png的背景，此页面显示在iframe中。如何使用maindome.html更改bgframe5.png背景？我也必须改变maindome的不透明度。

<script>
$(document).ready(function(){
        $('iframe').contents().find('body').css('backgroundImage', 'url_of_img.png');
        $('iframe').contents().find('body').css('opacity', 0.8);
    });"
</script>

我已经google了，我读了一些网上的东西，我写了上面的代码。顺便说一句，因为我不知道jQuery，当我按下按钮时如何调用这个函数（如果它是正确的）？

Answer 1

首先这一行不正确：

    $('iframe').contents().find('body').css('backgroundImage', 'url_of_img.png');

应该是：

    $('iframe').contents().find('body').css('background-image', 'url(url_of_img.png)');

回答您的评论：

HTML按钮：

 <input type='button' id='id_btn' />

JS代码：

$(document).ready(function(){

 $('#id_btn').click(function(){

    $('iframe').contents().find('body').css('background-image', 'url(url_of_img.png)');
    $('iframe').contents().find('body').css('opacity', 0.8);

 });
});

Answer 2

jsFiddle demo

HTML

<button id="btn">Hi</button>
<iframe id="dado" src="google.com" width="100%" height="840px" frameBorder="0">
   Your browser doesn't load this iframe.
</iframe>

的JavaScript

$('#btn').click(function(){
   $('iframe').contents().find('body').css('background-image', 'url(http://lorempixel.com/400/200/)');
});