引导选项卡在 Java/Spring Boot 应用程序中无法正常工作

Question

这应该很简单，我在 javascript 应用程序中使用了模态和引导程序，从来没有遇到过这个问题。 在这个 java 应用程序中，我有一个模式，当点击相应的链接/选项卡时，它打开并具有引导选项卡来切换某些内容。所有三个选项卡的所有内容都显示出来，当点击链接时，它只是将 href 添加到 url 而不是更改内容....知道为什么会发生这种情况以及为什么内容没有显示出来吗？我不希望将 href/id 附加到 url，因为 url 不会改变，因为它是模态的。

<div id="modal" class="modal fade" data-izimodal-title="Add Document">
        <div class="row" style="padding:0 25px;">

            <ul class="nav nav-tabs">
                <li><a data-toggle="tab" href="#newRequiredDocForm" >Required Documentation </a></li>
                <li><a data-toggle="tab" href="#newLicenseForm">License</a></li>
                <li><a data-toggle="tab" href="#newInsuranceForm">Insurance </a></li>
            </ul>
            <div class="tab-content">
                <div id="newRequiredDocForm" class="tab-pane fade">
                    <p>required doc tab content</p>
                </div>
                <div id="newLicenseForm" class="tab-pane fade">
                    <p>licences tab content</p>
                </div>
                <div id="newInsuranceForm" class="tab-pane fade">
                    <p>insurance tabs content</p>
                </div>
            </div>

        </div>
 </div>

Answer 1

嘿@Stacie 我得到了这个问题的解决方案。首先，我将此类添加到锚标记，但是当我将类添加到 li 时，它在我的情况下完美运行。

      <ul class="nav nav-tabs nav-fill">
                <li class="nav-item nav-link active "><a href="#newRequiredDocForm" class="active" data-toggle="tab" style="font-size:1.0rem">RequiredDoc</a></li>
                <li class="nav-item nav-link "><a href="#newLicenseForm" class="active" data-toggle="tab" style="font-size:1.0rem" disabled="disabled">License</a></li>
                <li class="nav-item nav-link "><a href="#newInsuranceForm" class="active" data-toggle="tab" style="font-size:1.0rem">Insurance</a></li>
      </ul>