使用JavaScript调用github:davidjbradshaw/iframe-resizer，不使用JQuery

Calling the github:davidjbradshaw/iframe-resizer using JavaScript without JQuery?

本文关键字：JQuery iframe-resizer 调用 JavaScript github davidjbradshaw 使用      更新时间：2023-09-26

我试图使用https://github.com/davidjbradshaw/iframe-resizer iframe调整器和示例(https://github.com/davidjbradshaw/iframe-resizer/tree/master/example)似乎是基于JQuery。有人知道如何通过JavaScript调用这个，而不使用JQuery吗?它是否需要一个body onload或者我是否捕获iframe的onload事件?我很困惑如何开始使用它(调用它)。

编辑……

  1. 为什么?动态内容:我需要我的iframe根据iframe内"变化"的内容动态调整其高度。我已经尝试了许多类似下面的解决方案，但它们并不能"完全"100%地解决问题。他们只根据iframe内容的"第一页"设置大小:

    <script type="text/javascript">
<!--
//Credit for script: http://th.atguy.com/mycode/100_percent_iframe/
<script language="JavaScript">
function resize_iframe()
{
var height=window.innerWidth;//Firefox
if (document.body.clientHeight)
{
    height=document.body.clientHeight;//IE
}
//resize the iframe according to the size of the
//window (all these should be on the same line)
document.getElementById("glu").style.height=parseInt(height-
document.getElementById("glu").offsetTop-8)+"px";
}
// this will resize the iframe every
// time you change the size of the window.
window.onresize=resize_iframe; 
//Instead of using this you can use: 
//  <BODY onresize="resize_iframe()">
//--></script>

  2. 现有文档。/不明白:我没有遵循DavidBradshaw提供的关于如何做到这一点的现有文档:我尝试添加以下代码。但显然，这不是你应该做的。

文件主体为:

    <iframe src="http://www.domain.net/store20/StoreTop.aspx?StoreID=17" width="100%" scrolling="no" onload="iFrameResize()"></iframe>

脚本:

    <script type="text/javascript" src="../src/iframeResizer.min.js"></script> 
    <script type="text/javascript">
    <!--
    <script language="JavaScript">
    iFrameResize(); 
    // this will resize the iframe every
    // time you change the size of the window.
    window.onresize=iFrameResize; 
    //Instead of using this you can use: 
    //  <BODY onresize="resize_iframe()">
    //--></script>

同样在iframe内的被调用内容处，我有这行代码。不过，我很确定这部分是正确的。

    <script type="text/javascript" src="../js/iframeResizer.min.js"></script>

提前感谢您的帮助。我很抱歉，如果我看起来很密集或这是一个愚蠢的问题，但我看到的例子原型:iFrameResize([{options}]，[selector]);

然而，你不需要一个"事件"来触发这个函数吗?看看我的代码，我使用onload事件，它不起作用。如果我设置iframe的ID来建立一个[selector]:

    <iframe id="testframe" src="http://www.domain.net/store20/StoreTop.aspx?StoreID=17" width="100%" scrolling="no" onload="iFrameResize()"></iframe>

并命名为:

    iFrameResize(,testframe);

或:

    iFrameResize(,$("#testframe"));

还是不行。我没有任何选项，我想保持默认值

你可以选择。

$("#testframe").iFrameResize();

或

iFrameResize(null,"#testframe");

可以使用

iFrameResize(,'iframe#testframe');
相关文章：