页面刷新后导航不变的问题处理方案

写导航页的时候，发现刷新一下选中的导航样式就会没有了，所以需要进行处理。

方案：

用sessionStorage对当前选中的导航页索引进行保存，刷新页面后再从sessionStorage里面取出并设置要选中的导航样式。

<nav class="navbar navbar-default">
    <p class="container-fluid">
        <p class="navbar-header">
            <a class="navbar-brand" href="#">测试</a>
        </p>
        <p class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">导航1 </a></li>
                <li><a href="#">导航2</a></li>
                <li><a href="#">导航3</a></li>
                <li><a href="#">导航4</a></li>
                <li><a href="#">导航5</a></li>
            </ul>

        </p>
    </p>
</nav>


<script type="application/javascript">
    $(function(){
       $(".nav li").click(function () {
           var index = $(this).index();
           sessionStorage.setItem("currentNav",index);
           $(this).addClass("active").siblings().removeClass("active");
       });
       window.onload = function () {
           var index = sessionStorage.getItem("currentNav");
           var li = $(".nav li").eq(index);
           li.addClass("active").siblings().removeClass("active");
       }
    });
</script>