在使用layui的layer插件打开弹出层的时候，会出现弹出层的Iframe高度设置为默认的150px，这样会导致出现滚动条或者内容显示不全的现象，在网上面也搜索了对应的解决方案。

方案一：在弹窗的时候，设置area只规定宽度，不设置高度，让插件自适应，如下：

layui.layer.open({
	type:2,
	//此处只规定宽度，不规定高度，让插件自适应高度
	area:['300px'],
	content:'www.baidu.com',
	shade:0.5,
	title:'百度页面'
})

但是这个方法亲测是无效的，无法达到高度自适应的效果。

方案二：同理，把area设置为auto，让插件自适应高度和宽度

layui.layer.open({
	type:2,
	//此处设置为auto，让插件自适应高度和宽度
	area:['auto'],
	content:'www.baidu.com',
	shade:0.5,
	title:'百度页面'
})

这个亲测也是无效的。

方案三：在弹窗前把元素的高度和宽度计算出来，将计算的高度和宽度传入弹窗参数，从原理上是可行的，但是适用于页面内元素弹窗，对于加载网页链接的iframe弹出层，效果有待考究。

var sampleElement=document.getElementById('sampleElementID');
layui.layer.open({
	type:1,
	//此处设置元素的宽高度，让插件指定弹出iframe的高度和宽度
	area:[`${sampleElement.offsetWidth}px`,`${sampleElement.offsetHeight}px`],
	content:sampleElement.outerHTML,
	shade:0.5,
	title:'百度页面'
})

此方法有局限性，显示内容要是页面内元素，如果是打开链接的iframe的方式，有待考究。

方案四：在弹窗页面加载成功之后，使用layer.iframeAuto对iframe进行重新高度定义。

layui.layer.open({
    type: 2,
    title:'百度页面',
    area: '300px',
    shade:0.5,
    content:'www.baidu.com',
    success: function(layero, index) {
    	//对加载后的iframe进行宽高度自适应
        layer.iframeAuto(index);
    }
});

此方法有待考究，对于页面内的元素是有效，但是对于链接的iframe层的高度适应需要测试

方案五：在弹出层成功之后 ，对iframe内容进行重新计算高度。

layui.layer.open({
    type: 2,
    title:'百度页面',
    area: '300px',
    shade:0.5,
    content:'www.baidu.com',
    success: function(layero, index) {
    	//找到当前弹出层的iframe元素
        var iframe = layui.$(layero).find('iframe');
        //设定iframe的高度为当前iframe内body的高度
        iframe.css('height', iframe[0].contentDocument.body.offsetHeight);
        //重新调整弹出层的位置，保证弹出层在当前屏幕的中间位置
        $(layero).css('top', (window.innerHeight - iframe[0].offsetHeight) / 2);    
    }
});

此方法亲测有效，不管是对于链接的弹窗还是页面内元素的弹窗，都能自适应高度。唯一的问题，在处理高度的时候，是弹窗完成后重新计算的，所以会视觉上会有高度的变化，不过处理速度快，基本上肉眼看不出。

用于记录自己遇到的问题，如果有错误，希望大家指正！