iframe 经验分享
iframe中调整高度
首先要知道,在子窗口中是没法直接修改父窗口中的参数的,所以一种间接的方法就是在子窗口中调用父窗口的函数,通过函数进行修改.
父窗口中的函数
// 首先要创建修改的函数
function changeIframeHeight(height){
// 接着获取该iframe的JQuery对象,这里以JQuery为例
var iframeObject=$("iframeObject");
iframeObject.height(height);
}
子窗口中的函数
var height=123;
// 调用父窗口中的函数需要加上 parent
parent.changeIframeHeight(height);
这样就间接的从子窗口中修改了其iframe
的高度.不仅仅是高度,这样也证明了一点,如何在子,父窗口之间进行数据通信.
iframe中数据通信
其实思路是一样的,只不过从原来的使用函数来传递,再多走一步,使用<input type='hidden'>
来存储,具体过程如下:
在父页面中设置一个隐藏域,用来存储想要长久存储的值:
<input type='hidden' name='user_name' value='trouble i am in'/>
接着再编写类似上面的修改函数:
function changeUserName(new_user_name){
$("input[name='user_name']").val(new_user_name);
}
再来在子窗口中使用关键字:parent
调用函数,并传入新的值即可.其中也有在网上百度说可以使用parent
直接修改父窗口中的参数,但是没有成功,之后折中想到了这个办法,实现了在子,父窗口之间通信.