Question

我正在尝试在项目中使用选项卡式页面，并且选项卡不起作用。选项卡本身似乎可以正常工作，但是单击选项卡后内容不会切换。

我正在使用引导程序4，并且已经研究了此问题，并且看来代码中的所有内容都是正确的，但是选项卡未链接到所定义的内容。这是我的代码，在第一个标签中没有大格式。

<div class="container">
    <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#location">Location</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#address">Addresses</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#phone">Phones</a></li>
        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#contact">Contacts</a></li>
    </ul>

    <div class="tab-content">
        <div id="location" class="tab-pane fade show active">
[Form Code]
        </div>
        <div id="address" class="tab-pane fade show">
            <h3>Menu 1</h3>
            <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
        <div id="phone" class="tab-pane fade">
            <h3>Menu 2</h3>
            <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
        </div>
        <div id="contact" class="tab-pane fade">
            <h3>Menu 3</h3>
            <p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
        </div>
    </div>
</div>

在控制台上，我收到以下错误：

jquery.min.js：1251未捕获的TypeError：$（...）。bootstrapMaterialDesign不是函数

我不知道这将如何或是否会影响我的问题。

Answer 1

我发现了问题。我在构建中缺少一个javascript。感谢Kalpesh指出我的代码是正确的。它让我寻找其他可能性...

为什么单击我的Razor页面上的选项卡控件时不会更改内容？

1 个答案: