Question

这就是我在基类

上的内容

<!DOCTYPE html>
<html lang="en">

<head>
 <meta charset="UTF-8">
 <title>READ JSON Example (AJAX)</title>
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 <script type="text/javascript">
 $(document).ready(function () {
     $.ajax({
         type: "GET",
         url: "http://phonegappro.esy.es/test/json.php",
         crossDomain: true,
         cache: false,
         success: function (result) {
             var result = $.parseJSON(result);
             $.each(result, function (i, field) {
                 $("#output").append("Title: " + field.title + " duration: " + field.duration + " Price:" + field.price + "<br/>");
             });
         }
     });
 });
 </script>
</head>
<body>
 <div id="output">

 </div>
</body>
</html>

<ul class="nav navbar-nav side-nav"> <li> <a href="#" th:href="@{/home}">Home</a> </li> <li class="active"> <a href="#" th:href="@{/page}">My Page</a> </li> </ul>是一个类，它使侧面导航栏突出显示用户所在的相应选项卡。我已经为每个页面手动完成了这个操作但是我知道class="active"你可以有一个基类，只需在页面上标记你想要更改的内容并用新内容替换它们。

这是我到目前为止所做的...... Thymeleaf

base.html

<ul class="nav navbar-nav side-nav"> <li> <a href="#" th:href="@{/home}">Home</a> </li> <li th:include="this :: active"> <a href="#" th:href="@{/page}">My Page</a> </li> </ul>

page.html

但我的问题是......我是否可以在<ul class="nav navbar-nav side-nav" th:fragment="active"> <li class="active"> <a href="#" th:href="@{/page}">My Page</a> </li> </ul>代码中替换active的{{1}}一词？

提前致谢：）

Answer 1

你可以尝试这个，并告诉你这是否适合你

基类

<ul class="nav navbar-nav side-nav">
    <li>
        <a href="#" th:href="@{/home}">Home</a>
    </li>

    <li th:classappend="${#httpServletRequest.getRequestURI() == '/page' ? 'active':''}">
        <a href="#" th:href="@{/page}">My Page</a>
    </li>
    <li th:classappend="${#httpServletRequest.getRequestURI() == '/otherpage' ? 'active':''}">
        <a href="#" th:href="@{/otherpage}">My Other Page</a>
    </li>
</ul>

并在page.html中删除活动类

<ul class="nav navbar-nav side-nav" th:fragment="active">
        <a href="#" th:href="@{/page}">My Page</a>
</ul>

如何在标签内放置一个块来更改类？

1 个答案: