Javascript 基于div高度显示/隐藏段落

我有下面的代码，我试图在默认情况下隐藏第2段，并在单击蓝色圆圈并展开div时显示该段

这是密码

$（文档）.ready（函数（）{
//在数据属性中存储内部高度：
$（“.added-msg-inner”）.removeClass（“added-msg-inner”）.each（function（）{
$（此）。数据({
内部高度：$（this）.height（）
});
}).addClass（'added-msg-inner'）；
$（“.added msg internal>p:n子级（2）”）.hide（）；
$（“.downarrow”）。单击（函数（）{
//获取与此向下箭头相关的特定divView和innerHeight
var$divView=$（this.sibbines（“.added msg inner”）；
var innerHeight=$divView.data（“innerHeight”）；
$divView.animate({
高度：$divView.height（）==95？内部高度：“95px”
}, 500);
$（'i'，this.attr（“类”，
$divView.height（）==95？“fa角度向上”：
“fa角向下”）；
返回false；
var$minHeight=95；
如果（$（this）.height（）>$minHeight）{
$（“.added msg internal>p:n子项（2）”）.show（）；
}
});
});
.added-msg2{
填充：3%1%；
浮动：左；
宽度：100%；
框大小：边框框；
字体大小：14px；
颜色：#333333；
位置：相对位置；
背景色：#E0；
}
.添加了味精{
浮动：左；
宽度：100%；
高度：95px；
溢出：隐藏；
}
.向下箭头{
位置：绝对位置；
右：15px；
底部：-12px；
z指数：1；
宽度：30px；
高度：30px；
线高：30px；
字号：18px；
颜色：#fff；
背景色：#003478；
边界半径：50%；
文本对齐：居中；
字体大小：粗体；
光标：指针；
}

代理用户于2017年6月24日（上午5:03）星期六添加的消息

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。信息技术
它不仅存活了五个世纪

ABCFileName.pdf

只需删除
return
语句，并使用jQuerys methode的回调函数在动画完成后显示段落：


$（文档）.ready（函数（）{
//在数据属性中存储内部高度：
$（“.added-msg-inner”）.removeClass（“added-msg-inner”）.each（function（）{
$（此）。数据({
内部高度：$（this）.height（）
});
}).addClass（'added-msg-inner'）；
$（“.added msg internal>p:n子级（2）”）.hide（）；
$（“.downarrow”）。单击（函数（）{
//获取与此向下箭头相关的特定divView和innerHeight
var$divView=$（this.sibbines（“.added msg inner”）；
var innerHeight=$divView.data（“innerHeight”）；
$divView.animate({
高度：$divView.height（）==95？内部高度：“95px”
}，500，函数（）{
//动画完成：
如果（$divView.height（）>95）{
$（“.added msg internal>p:n子项（2）”）.show（）；
}否则{
$（“.added msg internal>p:n子级（2）”）.hide（）；
}
});
$（'i'，this.attr（“类“，$divView.height（）==95？“fa角度向上”：“fa角度向下”）；
});
});
.added-msg2{
填充：3%1%；
浮动：左；
宽度：100%；
框大小：边框框；
字体大小：14px；
颜色：#333333；
位置：相对位置；
背景色：#E0；
}
.添加了味精{
浮动：左；
宽度：100%；
高度：95px；
溢出：隐藏；
}
.向下箭头{
位置：绝对位置；
右：15px；
底部：-12px；
z指数：1；
宽度：30px；
高度：30px；
线高：30px；
字号：18px；
颜色：#fff；
背景色：#003478；
边界半径：50%；
文本对齐：居中；
字体大小：粗体；
光标：指针；
}

代理用户于2017年6月24日（上午5:03）星期六添加的消息

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。信息技术
它不仅存活了五个世纪

ABCFileName.pdf

我已经修改了您的代码，以便在加载时隐藏第二段（消息），单击蓝色圆圈，该段将滑动打开

我不确定段落中某些样式的目的，所以我删除了它。父div的高度将自动扩展，因此可能不需要隐藏溢出等

很多JS看起来可能是不必要的，我在下面添加的代码片段足以扩展您描述的段落。此外，我还在HTML（段落）中添加了一些语义类

代码如下：


$（文档）.ready（函数（）{
$（'.downarrow'）。在（“单击”，函数（）{
$（'.added msg content'）.slideToggle（）；
});
});
.added-msg2{
填充：3%1%；
浮动：左；
宽度：100%；
框大小：边框框；
字体大小：14px；
颜色：#333333；
位置：相对位置；
背景色：#E0；
}
.添加了味精{
浮动：左；
宽度：100%；
}
.向下箭头{
位置：绝对位置；
右：15px；
底部：-12px；
z指数：1；
宽度：30px；
高度：30px；
线高：30px；
字号：18px；
颜色：#fff；
背景色：#003478；
边界半径：50%；
文本对齐：居中；
字体大小：粗体；
光标：指针；
}
。添加味精内容{
显示：无；
}

代理用户于2017年6月24日星期六（5:03）添加的消息

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。信息技术
它不仅存活了五个世纪

ABCFileName.pdf

谢谢你的回答，妈妈