阿帕奇瓷砖2.5 - 我在使用Spring MVC 3.1和Tiles标记菜单元素为活动

Question

2.

我有这样的瓷砖：

<ul class="nav"> 
    <li class="active"><a href="/person">Person</a></li> 
    <li><a href="/student">Student</a></li> 
    <li><a href="/superadmin">Superadmin</a></li> 
</ul> 

而且tiles.xml：

<tiles-definitions> 
    <definition name="base.definition" template="/WEB-INF/pages/tiles/template.jsp"> 
     <put-attribute name="meta" value="/WEB-INF/pages/tiles/meta.jsp" /> 
     <put-attribute name="head" value="/WEB-INF/pages/tiles/head.jsp" /> 
     <put-attribute name="navbar" value="/WEB-INF/pages/tiles/navbar.jsp" /> 
     <put-attribute name="sidebar" value="/WEB-INF/pages/tiles/sidebar.jsp" /> 
     <put-attribute name="body" value="" /> 
     <put-attribute name="footer" value="/WEB-INF/pages/tiles/footer.jsp" /> 
    </definition> 


    <definition name="user.new" extends="base.definition"> 
     <put-attribute name="body" value="/WEB-INF/pages/user.new.jsp" /> 
    </definition> 

    <definition name="user.show" extends="base.definition"> 
     <put-attribute name="page_title" value="Tiles tutorial homepage" type="string"/> 
     <put-attribute name="section_title" value="User's list" type="string"/> 
     <put-attribute name="body" value="/WEB-INF/pages/user.show.jsp" /> 
    </definition> 


    <definition name="login" template="/WEB-INF/pages/login.jsp"> 
     <put-attribute name="meta" value="/WEB-INF/pages/tiles/meta.jsp" /> 
     <put-attribute name="head" value="/WEB-INF/pages/tiles/head.jsp" /> 
     <put-attribute name="body" value="/WEB-INF/pages/login.jsp" /> 
    </definition> 

</tiles-definitions> 

现在，我想为所选菜单设置“活动”类。 我可以用瓷砖吗？或者我必须和Spring一起查看？

Answer 1

方法1 - JSP/JSTL和Spring /豆

更改你的菜单瓦搭建使用一些菜单对象，您可以在会话/模型设置列表菜单。菜单对象可以有一个布尔标志，指示哪一个设置活动类。

方法2 - 的JavaScript /会话

如果你不想做这种方式，你可以使用HTML类，JavaScript和会话/模型的组合attributeto完成任务。你会做什么是超载您的LI元素的类属性，是这样的：

<ul class="nav"> 
    <li class="person"><a href="/person">Person</a></li> 
    <li class="student"><a href="/student">Student</a></li> 
    <li class="superadmin"><a href="/superadmin">Superadmin</a></li> 
</ul> 

那么你将有一个小JS，使用JSTL来获取类，选择适当的LI元素，并设置类。与jQuery它可能看起来像：

$(document).ready(function() { 
    $('.${mySelectedClass}').addClass('active'); 
}); 

这将使用jQuery选择合适的LI和“主动”类添加到它。

方法3 - 使用URL

如果你不喜欢你绑菜单中的属性的存在，并且你知道你的网址就会被解析时，将有你可以使用一些信息纯JSTL要确定哪个LI设置为活动，您可以使用它。你可以得到当前页面的URL像

<c:out value="${pageContext.request.requestURL}"/> 

解析$ {} pageContext.request.requestURL以某种有意义的方式，你可以用它来确定这是积极的。

方法4 - 纯JavaScript使用URL

与上述相同，但使用JavaScript来得到当前的URL，解析它，并且操作DOM正如我们在做法并2.

希望有这些帮助你。