Javascript 在JSP中设置所选菜单项

我试图突出显示链接到新页面的选定菜单项。将背景图像切换为较亮的图像是可行的，但页面上的设置滞后。索引页是正确的，但随后它开始突出显示以前单击的菜单项

我开始在每个页面上使用JSP的会话属性（

request.setAttribute（“menuitem”、“home”）

）。这些页面由两部分组成：

• 标题
• 身体

菜单位于标题中，单击菜单项可重新加载整个页面。通过每页正文顶部的scriptlet添加

setAttribute

。页面加载完成后，我将类更改为高亮显示

我该如何解决对突出显示更改的延迟响应？或者我应该使用不同的方法？ 菜单项示例：

<div id="home" class="menu clickable" 
    <div>Home</div> 
</div>

<script>
    function checkMenuItem() {
        /*var selected=getMenuItem("selectedmenu");*/
        var selected = <%= (String) request.getAttribute("selectedmenu") %>
        if (selected != null && selected != "") {
            switch (selected) {
            case 'home':
                $("#home").removeClass('clickable').addClass('selected');
                $(".menu").not("#home").addClass('clickable'); <% chosenpage = "home";
                request.setAttribute("selectedmenu", chosenpage); %>
                break;
            case 'upload':
                $("#upload").removeClass('clickable').addClass('selected');
                $(".menu").not("#upload").addClass('clickable'); <% chosenpage = "upload";
                request.setAttribute("selectedmenu", chosenpage); %>
                break;
            case 'question':
                $("#question").removeClass('clickable').addClass('selected');
                $(".menu").not("#question").addClass('clickable'); <% chosenpage = "question";
                request.setAttribute("selectedmenu", chosenpage); %>
                break;
            case 'plan':
                $("#plan").removeClass('clickable').addClass('selected');
                $(".menu").not("#plan").addClass('clickable'); <% chosenpage = "plan";
                request.setAttribute("selectedmenu", chosenpage); %>
                break;
            case 'indication':
                $("#indication").removeClass('clickable').addClass('selected');
                $(".menu").not("#indication").addClass('clickable'); <% chosenpage = "indication";
                request.setAttribute("selectedmenu", chosenpage); %>
                break;
            default: $("#home").removeClass('clickable').addClass('selected');
              $(".menu").not("#home").addClass('clickable');
             break;
           }
        } //end if
    }



    $('document').ready(function () {
     checkMenuItem();    
         $("#home").click(
                 function(){ document.location.href="<%=request.getContextPath()%>/index.html";} );
         $("#upload").click(
                 function(){ document.location.href="<%=request.getContextPath()%>/upload.html";} );
         $("#indicator").click(
                 function(){ document.location.href="<%=request.getContextPath()%>/plan/indicator.html";} );
         $("#plan").click(
                 function(){ document.location.href="<%=request.getContextPath()%>/plan/improvementplans.html";} );
         $("#question").click(
                 function(){ document.location.href="<%=request.getContextPath()%>/question.html";} );
    });
</script>

---

那么，您想突出显示当前所在的页面吗？更改到新页面是否也会重新加载页眉和页脚，还是只重新加载正文？如果只是主体，您使用的是Ajax或iframe，还是。。。？如果显示标记和JS（精简版），可能更容易给出合理的答案。@Aadaam是的，没错。我想突出显示那个选项卡。@nnnnnn一个片段
code
Home
code
我想至少这意味着只有主体在改变。在任何情况下，收割台都会在车斗之前加载。抱歉，代码格式设置不正常。我是新来的。@water你能编辑你的问题而不是在评论中粘贴代码吗。这将有助于其他人更容易地回答您的问题。谢谢