水平标签不显示内容

Question

放在Moodle书中的水平标签html，当您查看此内容时，它不会向您显示我放置在其中的内容，它只是空白，当您单击该标签时，您可以看到该内容，但它像最初的内容一样打开页面时，view不会显示任何内容，并且一旦单击选项卡上的viewable即可，但这很烦人。有帮助吗？

 <!-- Start of horizontal tabs -->
    <ul class="nav nav-pills mb-0" id="pills-tab" role="tablist">
        <li class="nav-item">
            <a class="nav-link active show" id="h-tabs-t1-tab" data-toggle="pill" href="#h-tabs-t1" role="tab" aria-controls="h-tabs-t1" aria-selected="true">ONE</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="h-tabs-t2-tab" data-toggle="pill" href="#h-tabs-t2" role="tab" aria-controls="h-tabs-t2" aria-selected="false">TWO</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="h-tabs-t3-tab" data-toggle="pill" href="#h-tabs-t3" role="tab" aria-controls="h-tabs-t3" aria-selected="false">THREE</a>
        </li>
    </ul>
    <div class="tab-content card" id="pills-tabContent">
        <div class="tab-pane p-3 fade active show" id="h-tabs-t1" role="tabpanel" aria-labelledby="h-tabs-t1-tab">
            <h4>ONE</h4>
            <p>Nisl vel pretium lectus quam id leo. Dolor purus non enim praesent elementum facilisis leo vel. Sit amet nulla facilisi morbi tempus. Facilisis volutpat est velit egestas dui id ornare. Est lorem ipsum dolor sit amet.</p>
        </div>
        <div class="tab-pane p-3 fade" id="h-tabs-t2" role="tabpanel" aria-labelledby="h-tabs-t2-tab">
            <h4>TWO</h4>
            <p>Sollicitudin ac orci phasellus egestas tellus rutrum. Commodo odio aenean sed adipiscing diam donec adipiscing tristique risus. </p>
        </div>
        <div class="tab-pane p-3 fade" id="h-tabs-t3" role="tabpanel" aria-labelledby="h-tabs-t3-tab">
            <h4>THREE</h4>
            <p>Aliquet enim tortor at auctor urna nunc id. Sem integer vitae justo eget magna fermentum.</p>
        </div>
    </div>
<!-- End of horizontal tabs -->

Answer 1

您是否在html中包含了jQuery库脚本？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

还要在div中添加'show'类，也包装每个标签的内容

<div class="tab-pane p-3 fade show"
     id="h-tabs-t2"
     role="tabpanel"
     aria-labelledby="h-tabs-t2-tab">
       <h4>TWO</h4>
         <p>
            Sollicitudin ac orci phasellus egestas tellus rutrum. Commodo odio
            aenean sed adipiscing diam donec adipiscing tristique risus.
         </p>
</div>