寻找一种保持菜单标签的有效方法

Question

这就是我得到的：

$(document).ready(function () {
    if (window.location.href.indexOf("/db1-1") > -1) {
        $('.db1sub').closest("db1sub").css("display","block");}
    else {
        $('.db1sub').closest(".db1sub").css("display","none");}
});
$(document).ready(function () {
    if (window.location.href.indexOf("/db1-2") > -1) {
        $('.db2sub').closest("db2sub").css("display","block");}
    else {
        $('.db2sub').closest(".db2sub").css("display","none");}
});
$(document).ready(function () {
    if (window.location.href.indexOf("/db1-3") > -1) {
        $('.db3sub').closest("db3sub").css("display","block");}
    else {
        $('.db3sub').closest(".db3sub").css("display","none");}
});

这是代码适用的部分

<!--        First dashboard selection            -->
                    <li><a class="selected1" href="#">Dashboard 1</a></li>
                    <div class="db1sub">
                        <ul>
                            <li><a href="#">Dashboard a0</a></li>
                            <li><a href="#">Dashboard a1</a></li>
                            <li><a href="#">Dashboard a2</a></li>
                        </ul>
                    </div>
<!--        Second dashboard selection            -->
                    <li><a class="selected2" href="#">Dashboard 2</a></li>
                    <div class="db2sub">
                        <ul>
                            <li><a href="#">Dashboard b0</a></li>
                            <li><a href="#">Dashboard b1</a></li>
                            <li><a href="#">Dashboard b2</a></li>
                        </ul>
                    </div>
<!--        Third dashboard selection            -->
                    <li><a class="selected3" href="#">Dashboard 3</a></li>
                    <div class="db3sub">
                        <ul>
                            <li><a href="#">Dashboard c0</a></li>
                            <li><a href="#">Dashboard c1</a></li>
                            <li><a href="#">Dashboard c2</a></li>
                        </ul>
                    </div>
                </ul>
            </div>

我要做的是，每当单击其中一个列表中的<>之一时，只要进入下一页，该选项卡就会保持打开状态。现在的功能很棒，可以按照我想要的方式工作。但是，用于此的 javascript 似乎可以对其进行优化，因为 db2sub 和 db3sub 的 if 语句只是在我为 db1sub 创建 if 语句后复制并粘贴的。有没有办法可以缩小我的javascript的代码，这样我就不必继续复制和粘贴所有内容？

Answer 1

这样的东西？

$(document).ready(function () {
   var obj = { 
     "db1sub" : "/db1-1", 
     "db2sub" : "/db1-2", 
     "db3sub" : "/db1-3" 
   };
   var selectedKey = "";
   for ( var key in obj )
   {
      $('.' + key ).closest( '.' + key ).css("display","none");
      if ( window.location.href.indexOf( obj[ key ] ) > -1) 
      {
         selectedKey = key;
      }
   }
   if ( selectedKey.length > 1 ) 
   {
        $( '.' + selectedKey ).closest( '.' + selectedKey ).css("display","block");
   }
});