为什么导航菜单上的当前页面不会更改？

我正在研究一个tumblr主题，我之前没有提供代码问过，所以我把这些代码放在一起，如果它能帮助你的话。为什么导航菜单上的当前页面不会更改？

我有一个if语句，如果window.current.href ==“家庭的HTML”（在这种情况下，我做了jsfiddle下面的HTML为测试目的），然后.css更改样式，因为我想它是。但它似乎没有工作，任何想法？

HTML：

<div id="headerMenu"> 
    <ul class="nav"> 
     <li> 
      <a href="http://whatchoodo.tumblr.com/"> 
       <span id="home">Home</span> 
      </a> 
     </li> 
     <li> 
      <a href="http://whatchoodo.tumblr.com/Dirty"> 
       <span class="dirty">Dirty Jokes</span> 
      </a> 
     </li> 
     <li> 
      <a href="http://whatchoodo.tumblr.com/Sport"> 
       <span id="sport">Sport</span> 
      </a> 
     </li> 
     <li> 
      <a href="http://whatchoodo.tumblr.com/Memes"> 
       <span id="memes">Memes</span> 
      </a> 
     </li> 
     <li> 
      <a href="http://whatchoodo.tumblr.com/Personal"> 
       <span id="personal">Personal Stuff</span> 
      </a> 
     </li> 
    </ul> 
</div>

的JavaScript：

$(document).ready(function() { 
    if (window.location.href == "http://jsfiddle.net/RichardWinter/c3vgy00n/2/") { 
     $("#home").css({ 
      border-bottom+color: #6DC176, 
      border-bottom-style: 'solid', 
      border-bottom-width: 3px, 
      color: #6DC176, 
      font-weight: 'bold', 
     }); 
});

来源

2015-01-02 Richard Lund Winther

你的代码有语法错误 – Leo

你有很多语法错误。尤其是，传递给jQuery .css的对象参数在其属性和值上缺少引号。另外，您if缺少一个末端大括号。

这应该是这样的：

if (window.location.href == "http://fiddle.jshell.net/_display/") { 
    $("#home").css({ 
     'border-bottom-color': '#6DC176', 
      'border-bottom-style': 'solid', 
      'border-bottom-width': '3px', 
      'color': '#6DC176', 
      'font-weight': 'bold', 
    }); 
}

它不是在小提琴为你工作，也因为小提琴使用一个框架来显示结果。你需要使用框架URL来测试。

看到这个：http://jsfiddle.net/abhitalks/c3vgy00n/4/

点击 “运行” 看到 “家” 的CSS效果。

。

来源

2015-01-02 13:53:59 Abhitalks

首先，你的JS有语法错误，动如下列：

$(document).ready(function() { 
    if (window.location.href == "http://jsfiddle.net/RichardWinter/c3vgy00n/2/") { 
     $("#home").css({ 
      'border-bottom-color': '#6DC176', 
      'border-bottom-style': 'solid', 
      'border-bottom-width': '3px', 
      'color': '#6DC176', 
      'font-weight': 'bold' 
     }); 
    } 
});

其次，该URL不匹配。 jsfiddle上的结果部分实际上在iframe中（http://fiddle.jshell.net/RichardWinter/c3vgy00n/2/show/）。第三，我想你真正想要修改的是锚点（<a>）风格，而不是它的子女<span>（这是我的假设，如果我错了，请纠正我）。

来源

2015-01-02 13:54:10 Leo

我明白了！我怎样才能检查Tumblr上的结果部分呢？我修正了语法错误，并添加了http://whatchoodo.tumblr.com/而不是jsfiddle链接，但它仍然无法工作。如果你想要看到的话，那就是主页的链接。噢，我将身份证从跨度改为周围的链接，再说一遍，你说他们是我想要的样式。谢谢，理查德。 –

@RichardLundWinther URL是''http://whatchoodo.tumblr.com/“'，而不是''whatchoodo.tumblr.com/”'。协议（http/https）是URL的一部分。 – Leo

@RichardLundWinther你可以运行'alert（window.location.href）'查看每个页面的正确URL。 – Leo

为什么导航菜单上的当前页面不会更改？

回答

相关问题