Java 如何通过按按钮替换div的内容

我想在navbar下面的容器中的a上使用th:insert。每个按钮都会插入不同的代码。我知道有一个th:if，但我不知道如何使用它来检查按钮是否按下。也许有比使用th:insert和th:if更好的解决方案

我只是想更改容器的内容，而不是重新加载到另一个页面。我已经准备好html文件，它将被插入到页面中。我使用的是Spring Boot、Spring MVC、Thymeleaf

导航条码：

<nav class="navbar navbar-custom" aria-label="Desktop Navigation">
    <div class="container">
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li><a href="link">Add User</a></li>
                <li><a href="link">Users List</a></li>
            </ul>
        </div>
    </div>
</nav>

集装箱代码：

<div class="row">
  <div class="col-sm-12">
    <th:block th:if="(What I should insert here?)">
       <div th:insert="fragments/panelFragments :: addUserFragment" />
    </th:block>
    <th:block th:if="(What I should insert here?)">
       <div th:insert="fragments/panelFragments :: usersListFragment" />
    </th:block>
  </div>
</div>

页面呈现后，您是否在浏览器中查看页面源时看到这些标签th:insert？如果没有，则表示他们已在服务器上输出数据。现在在前端，如果您不想回发来刷新页面，那么唯一的选择就是使用Javascript或jquery来更新您的视图。我不太清楚您的意思，但我将尝试解释一下。当用户自动登录时，我会插入“fragments/panelFragments:：addUserFragment”（我已经删除了第二次插入），并且效果很好。现在，我希望在从导航栏按Users List之后，能够将视图更改为“usersListFragment”。我假设我必须像你说的那样使用js或jquery，或者AJAX。你能给我一些解决办法吗？我只想补充一点，这些视图非常小，大多数只包含很少的标签。我认为我得到了一个简单的解决方案，这个解决方案非常糟糕，但可能会奏效。我会插入我需要的所有片段，并将它们设置为display:none，然后按下每个按钮，它们的“display”就会改变。把json拿回来。使用jquery在函数中创建标记。替换html标记。点击按钮触发ajax调用。然后在成功时调用标记生成器函数。然后替换新构建的页面上的标记markup@sebaokamuasif80建议的是处理该案件的正确方法。有很多关于页面呈现后要执行的操作的示例，您是否在浏览器中看到这些标签th:insert-on-view-source？如果没有，则表示他们已在服务器上输出数据。现在在前端，如果您不想回发来刷新页面，那么唯一的选择就是使用Javascript或jquery来更新您的视图。我不太清楚您的意思，但我将尝试解释一下。当用户自动登录时，我会插入“fragments/panelFragments:：addUserFragment”（我已经删除了第二次插入），并且效果很好。现在，我希望在从导航栏按Users List之后，能够将视图更改为“usersListFragment”。我假设我必须像你说的那样使用js或jquery，或者AJAX。你能给我一些解决办法吗？我只想补充一点，这些视图非常小，大多数只包含很少的标签。我认为我得到了一个简单的解决方案，这个解决方案非常糟糕，但可能会奏效。我会插入我需要的所有片段，并将它们设置为display:none，然后按下每个按钮，它们的“display”就会改变。把json拿回来。使用jquery在函数中创建标记。替换html标记。点击按钮触发ajax调用。然后在成功时调用标记生成器函数。然后替换新构建的页面上的标记markup@sebaokamuasif80建议的是处理该案件的正确方法。有很多关于你想做什么的例子