Question

所以，我一直在wordpress网站上工作，在网站的网页上有一个iframe.iframe包含2个按钮，使用jquery追加包含iframe中的内容。当前我包含了一个javascript函数来改变高度每次iframe加载。但我想按下iframe中的按钮时更改高度。 iframe在wordpress中的插件文件中定义，iframe src在wordpress主题文件夹中定义为模板。包含iframe标记的插件文件，

<iframe src="http://localhost/mysite/firstrate/" frameborder="0" 
scrolling="no" onload="resizeIframe();" id="starwindow" ></iframe>
<script>
var obj=document.getElementById("starwindow");
function resizeIframe() {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
}
</script>

包含iframe src（模板文件）的主题文件，

<button class="add_form_field" ><span>ADD</span></button>
<button id="button" class="submit_button"> SUBMIT </button>
<input type="radio" class="rating1" id="1star5" name="rating1" value="5" />
<label for="1star5" title="Five Stars">5 stars</label>
<input type="radio" class="rating1" id="1star4" name="rating1" value="4" />
<label for="1star4" title="Four Stars">4 stars</label>
<input type="radio" class="rating1" id="1star3" name="rating1" value="3" />
<label for="1star3" title="Three Stars">3 stars</label>
<input type="radio" class="rating1" id="1star2" name="rating1" value="2" />
<label for="1star2" title="Two Stars">2 stars</label>
<input type="radio" class="rating1" id="1star1" name="rating1" value="1" />
<label for="1star1" title="One Star">1 star</label>

This is the screenshot.

我希望iframe在iframe中按下按钮时增加高度，因此按下按钮时不会显示滚动条。提前感谢你。

Answer 1

你可以用jQuery做到这一点：

$('#starwindow').load(function(){

        var iframe = $('#starwindow').contents();

        iframe.find("#button").click(function(){
               resizeIframe();
        });
});

根据您要用于iframe调整大小的元素更改'#button'。

编辑：

$('#starwindow').load(function(){
    var iframe = $('#starwindow').contents();
    iframe.find("#add").click(function(){
        resizeIframe('add');
    });
    iframe.find("#delete").click(function(){
        resizeIframe('delete');
    });
});

并将您的功能更改为添加/删除高度

resizeIframe(mode) {
    if(mode=='add') {
        //code to add height
    }
    else {
        //code to delete height
    }
}

如果在iframe中单击按钮，我如何增加iframe的高度？

1 个答案: