时间戳

首页 > 解决方案 > 引导数据目标未按预期工作

html - 引导数据目标未按预期工作

问题描述

我正在尝试使用类似于下面的代码示例的引导数据目标。单击切换菜单时未加载数据。

<html xmlns.th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0">
    <link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}">
    <script type="text/javascript" th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
    <script type="text/javascript" th:src="@{/webjars/jquery/jquery.min.js}"></script>
</head>

<body>
    <div class="container-fluid">
        <div>
            <nav class="navbar navbar-expand-lg bg-dark navbar-dark">
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbar">
                    <ul class="navbar-nav">
                        <li class="navbar-item">
                            <a class="nav-link" th:href="@{/menu1}">Menu1</a>
                        </li>
                        <li class="navbar-item">
                            <a class="nav-link" th:href="@{/menu2}">Menu2</a>
                        </li>   
                    </ul>                   
                </div>
            </nav>
        </div>
    </div>
</body>
</html>

我正在使用 jQuery 3.6.0 和引导程序版本 5.0.1

标签： htmljquerycssbootstrap-5

解决方案

推荐阅读