Question

我有一个包含标题和子链接的列表，如下所示。

    <li>
      <a href="#"> <i class="fa fa-cogs fa-fw"></i> <span>SETTINGS</span> </a>
      <ul class="sub-menu">
        <li><a>PFA Setup</a></li>
        <li><a>Fund Setup</a></li>
        <li><a>Fee Setup</a></li>
        <li><a>Payment Setup</a></li>
      </ul>
    </li>

请，我需要一个解决方案，单击“设置”菜单，然后使用打字稿扩展子菜单类。我真的不知道如何用打字稿来完成这项工作。

谢谢。

Answer 1

JQuery支持：here。您应该做的是获取JQuery的类型化版本（JQuery accordion）。当包含类型化的JQuery时，您应该能够从TypeScript代码中调用手风琴函数。

Answer 2

您可以使用CSS类隐藏子菜单，然后单击<li>，这将激活子菜单，请使用：element.classList.toggle

css

.hide {
    display:none;
}

脚本-为您的<ul>子菜单分配一个ID

const toggleFunction = () => {
    var element = document.getElementById("id");
    element.classList.toggle("hide");
}

使用TypeScript的手风琴

2 个答案: