Javascript 如果内容太高，则无法关闭底部模式框

我需要添加到我的网站模式框，如

一切正常，除了模态的内容变得非常“高”（例如，要显示的行数很多）之外

我一直在尝试在这里和那里插入

overflow:auto

，希望它可以滚动，但没有成功，当这种情况发生时，模式无法关闭

我想一种方法是，当内容变得太高时，对

模式内容设置一个约束，使其粘在页面顶部，但我真的不知道如何

下面是一些代码，让您了解我的问题：


//获取模式
var modal=document.getElementById（'myModal'）；
//获取打开模式对话框的按钮
var btn=document.getElementById（“myBtn”）；
//获取关闭模态的元素
var span=document.getElementsByClassName（“关闭”）[0]；
//当用户单击该按钮时，打开模式对话框
btn.onclick=函数（）{
modal.style.display=“块”；
}
//当用户单击（x）时，关闭模式对话框
span.onclick=函数（）{
modal.style.display=“无”；
}
//当用户单击模式之外的任何位置时，将其关闭
window.onclick=函数（事件）{
如果（event.target==模态）{
modal.style.display=“无”；
}
}
body{font-family:Arial、Helvetica、sans-serif；}
/*模态（背景）*/
.莫代尔{
显示：无；/*默认情况下隐藏*/
位置：固定；/*保持原位*/
z指数：1；/*位于顶部*/
左：0；
排名：0；
宽度：100%；/*全宽*/
高度：100%；/*全高*/
溢出：自动；/*根据需要启用滚动*/
背景色：rgb（0,0,0）；/*回退色*/
背景色：rgba（0,0,0,0.4）；/*黑色w/不透明度*/
-webkit动画名称：fadeIn；/*在背景中淡入淡出*/
-webkit动画持续时间：0.4s；
动画名称：fadeIn；
动画持续时间：0.4s
}
/*模态内容*/
.模态内容{
位置：固定；
底部：0；
背景色：#fefe；
宽度：100%；
-webkit动画名称：slideIn；
-webkit动画持续时间：0.4s；
动画名称：slideIn；
动画持续时间：0.4s
}
/*关闭按钮*/
.结束{
颜色：白色；
浮动：对；
字号：28px；
字体大小：粗体；
}
.关闭：悬停，
.结束：聚焦{
颜色：#000；
文字装饰：无；
光标：指针；
}
.模态标题{
填充：2x16px；
背景色：#5cb85c；
颜色：白色；
}
.模态体{填充：2px 16px；}
.模态页脚{
填充：2x16px；
背景色：#5cb85c；
颜色：白色；
}
/*添加动画*/
@-webkit关键帧幻灯片{
从{底部：-300px；不透明度：0}
到{底部：0；不透明度：1}
}
@关键帧幻灯片{
从{底部：-300px；不透明度：0}
到{底部：0；不透明度：1}
}
@-webkit关键帧fadeIn{
从{opacity:0}
到{opacity:1}
}
@关键帧淡入淡出{
从{opacity:0}
到{opacity:1}
}
底部模式
开放模态
&时代；
模态头
情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

情态体中的一些文本

其他一些文本

模态页脚
你把溢出物放在哪里了？
我尝试添加overflow-x:scroll打开。模式内容。
它在我这边工作，模态正常关闭。只要调整高度，顶部或任何你想要的位置，如果这对你也适用的话

干杯。

//获取模式
var modal=document.getElementById（'myModal'）；
//获取打开模式对话框的按钮
var btn=document.getElementById（“myBtn”）；
//获取关闭模态的元素
var span=document.getElementsByClassName（“关闭”）[0]；
//当用户单击该按钮时，打开模式对话框
btn.onclick=函数（）{
modal.style.display=“块”；
}
//当用户单击（x）时，关闭模式对话框
span.onclick=函数（）{
modal.style.display=“无”；
}
//当用户单击模式之外的任何位置时，将其关闭
window.onclick=函数（事件）{
如果（event.target==模态）{
modal.style.display=“无”；
}
}
body{font-family:Arial、Helvetica、sans-serif；}
/*模态（背景）*/
.莫代尔{
显示：无；/*默认情况下隐藏*/
位置：固定；/*保持原位*/
z指数：1；/*位于顶部*/
左：0；
排名：0；
宽度：100%；/*全宽*/
高度：100%；/*全高*/
溢出：自动；/*根据需要启用滚动*/
背景色：rgb（0,0,0）；/*回退色*/
背景色：rgba（0,0,0,0.4）；/*黑色w/不透明度*/
-webkit动画名称：fadeIn；/*在背景中淡入淡出*/
-webkit动画持续时间：0.4s；
动画名称：fadeIn；
动画持续时间：0.4s
}
/*模态内容*/
.模态内容{
位置：相对位置；
底部：0；
背景色：#fefe；
.modal-body {padding: 2px 16px; height: 250px; overflow: auto}