Javascript 动态下拉列表的高度为0

我正在尝试用javascript动态创建HTML卡，其中包含

posts.forEach（函数（元素）{
....  
消息+='

如果我不使用动态添加创建按钮，则一切正常。通过如上所示动态添加按钮，菜单内容的高度为0：

…即使检查显示其高度应为50px：

我也试过：

为每个帖子添加唯一的下拉内容（trigger1打开drop1，trigger2打开drop2，等等）

---

单独初始化每个触发器。

我无法重现您遇到的问题，但下面的解决方案可能会给出一个想法，或者可能有助于解决问题。另外，请注意，下面的代码部分中做出了一些假设

var指数=1；
变量posts=[“post1”、“post2”、“post3”、“post4”、“post5”]；
posts.forEach（功能（元素）{
让post=document.createElement（'div'）；
post.id=“post”+索引；
文件.正文.附件（邮政）；
//剩余工作。。
让cloneDrop=document.getElementById（“dropTemplate”）.cloneNode（true）；
cloneDrop.style.visibility=“可见”；
cloneDrop.id=“drop”+索引；
document.getElementById（“post”+索引）.appendChild（cloneDrop）；
//剩余工作。。
让消息='

很自然，它不起作用。初始化组件时，它们会查找定义其行为的类或标识符（如下拉触发器）并附加这些行为。在这些组件初始化之后，您将创建元素，这样它们就不会有附加的行为。您需要做的是重新初始化所有组件或初始化您创建的组件manually@Eldar感谢您的回复。我不确定您是否熟悉Materialize库，但是m.AutoInit（）命令应重新初始化新组件。“Auto Init允许您通过单个函数调用初始化所有具体化组件。请务必注意，您不能使用此方法传入选项。”这并不意味着它应初始化在函数调用后动态添加的组件

    posts.forEach(function(element) {
        ....  
        message += '<a class="dropdown-trigger btn-flat" data-target="drop1">';
        message += '<i class="material-icons">more_vert</i>';
        message += '</a>';
        document.getElementById("post" + index).innerHTML = message;
        index++;
      }, this);
      M.AutoInit();

     <ul id="drop1" class="dropdown-content">
         <li><a href="#!">one</a></li>
         <li><a href="#!">two</a></li>
         <li><a href="#!">three</a></li>
     </ul>