zoukankan      html  css  js  c++  java
  • 前台开发-----处理导航不同页面的高亮显示

    初始时,头部导航栏首页一直处于高亮的模式

     

    当我们使用一个页面来包含另外一个页面的时候,我们可以在其中间进行传值,传递一个flag就知道被谁给包含了:

    <!-- header -->
    <jsp:include page="/header.jsp">
    <jsp:param value="1" name="flag"/>
    
    
    
    </jsp:include>

    header.jsp

        <li><a href="${pageContext.request.contextPath }"  <c:if test="${param.flag==1 }">class="active"</c:if>>首页</a></li>qi

    其余的也类似,由于热销和新品处于同一个页面所以需要多加一个条件,那就是它们的type,它们的type通过t来保存过在request中,所以由此作为判断当点击时,处于高亮显示:

    goodsrecommend_list.jsp

    <!-- header -->
    <jsp:include page="/header.jsp">
    
    <jsp:param value="3" name="flag"/>

    header.jsp

    <!-- 根据type的不同来进行区分热销和新品 -->
                            <li><a href="${pageContext.request.contextPath }/goodsrecommend_list?type=2"  <c:if test="${param.flag==3&&t==2 }">class="active"</c:if> >热销</a></li>
                            <li><a href="${pageContext.request.contextPath }/goodsrecommend_list?type=3"  <c:if test="${param.flag==3&&t==3 }">class="active"</c:if>>新品</a></li>
                            

    最终效果:

  • 相关阅读:
    设计【SPFA】【差分约束】
    黑魔法师之门【并查集】
    太鼓达人【欧拉回路】【DFS】
    七夕祭【模拟】
    圣章精灵使的魔法语【线段树】
    终章剑之魂【模拟】【贪心】
    轻轨【线段树】【贪心】
    气象牛【DP】
    HTML属性
    HTML元素
  • 原文地址:https://www.cnblogs.com/jiguiyan/p/10608020.html
Copyright © 2011-2022 走看看