-1

我对我的一个案例不工作有疑问。它们都可以工作,除了一个,它实际上在 URL 中有查询,但它们总是相同的。查询 URL 如下所示:http ://mywebsite.com/search/?q=label:Web-Design|label:Graphic-Design|label:Identity-Design|label:Brand-Design

它不起作用,我想知道 windows.location 是否支持 URL 中的查询。在我看来,这并不重要,但无论哪种方式,我都无法让它发挥作用。

我 100% 肯定这是正确的路径名,因为我复制并粘贴了它,只是为了像其他域一样删除域。

这就是我正在使用的:

    <script type='text/javascript'>
      $(document).ready(function(){
        switch (window.location.pathname) {
          default:
              $('.nav-blog').addClass('current');
              break;
          case '/p/about.html':
              $('.nav-about').addClass('current');
              break;
          case '/':
              $('.nav-home').addClass('current');
              break;
          case '/search/blog':
              $('.nav-blog').addClass('current');
              break;
          case '/p/forums.html':
              $('.nav-forums').addClass('current');
              break;
          case '/search/?q=label:Web-Design|label:Graphic-Design|label:Identity-Design|label:Brand-Design':
              $('.nav-design').addClass('current');
              break;
          case '/p/photography.html':
              $('.nav-photography').addClass('current');
              break;
          case '/p/hosting.html':
              $('.nav-hosting').addClass('current');
              break;
        }
      });
    </script>
4

1 回答 1

1

更改开关中的变量以包含查询字符串

$(document).ready(function(){
        switch (window.location.pathname + window.location.search) {
          default:
              $('.nav-blog').addClass('current');
              break;
              case '/p/about.html':
              $('.nav-about').addClass('current');
              break;
              case '/':
              $('.nav-home').addClass('current');
              break;
              case '/search/blog':
              $('.nav-blog').addClass('current');
              break;
              case '/p/forums.html':
              $('.nav-forums').addClass('current');
              break;
              case '/search/?q=label:Web-Design|label:Graphic-Design|label:Identity-Design|label:Brand-Design':
              $('.nav-design').addClass('current');
              break;
              case '/p/photography.html':
              $('.nav-photography').addClass('current');
              break;
              case '/p/hosting.html':
              $('.nav-hosting').addClass('current');
              break;
        }
      });

但是,如果它们最后有查询字符串,这将与其他情况不匹配,而且目前您的 switch 语句是区分大小写的,您可能应该 toUpperCase()toLowerCase()您的 switch。

这应该可以解决您的大部分问题:

$(document).ready(function(){
    var path = window.location.pathname.toLowerCase();
    if(path == '/search/')
    {
        if(window.location.search.toLowerCase() == '?q=label:web-design|label:graphic-design|label:identity-design|label:brand-design')
            $('.nav-design').addClass('current');
        else
            $('.nav-blog').addClass('current');
    }
    else
    {
        switch (path) {
          default:
            $('.nav-blog').addClass('current');
            break;

            case '/p/about.html':
                $('.nav-about').addClass('current');
                break;

            case '/':
                $('.nav-home').addClass('current');
                break;

            case '/search/blog':
                $('.nav-blog').addClass('current');
                break;

            case '/p/forums.html':
                $('.nav-forums').addClass('current');
                break;

            case '/p/photography.html':
                $('.nav-photography').addClass('current');
                break;

            case '/p/hosting.html':
                $('.nav-hosting').addClass('current');
                break;
        }
    }
});

您应该比我在这里对您的输入( window.location.path, )进行更多的清理,例如修剪它们(删除前导和尾随空格)并删除前导和尾随斜杠等。window.location.search

如果由于某种原因您的查询字符串值的顺序不同,还会发生什么?

像这样的事情可能会发生,例如有人通过电子邮件发送一个链接,并且它在末尾或查询字符串的某处有一个额外的空间,当收件人单击链接时,他们可能会转到正确的页面,但您的开关将达到默认值。

于 2013-09-02T03:31:52.980 回答