JQuery基于url hash和string隐藏div

时间:2013-10-01 19:58:44

标签: javascript jquery

我正在尝试根据url hash标签隐藏div。我正在使用一个名为zozo tabs的jquery插件,它允许深层链接,并显示和隐藏div。

页面上有一个特定的div(不在标签区域)我想隐藏给出url / s。我已经搜索过但无法弄明白。请原谅我的javascript noobness !!!我试过这个。没有这样的运气。它似乎没有用。任何帮助都会非常感激。

我已经尝试过php,但它不能用于哈希

要启动插件,请创建此类型的网址

http://localhost:8888/site/funds/#tabbed-nav=fund-strategy

html是:

 <ul>
    <li data-link="fund-strategy"><a>Fund Strategy</a></li>
    <li data-link="portfolio-characteristics"><a>Portfolio Characteristics</a></li>
    <li data-link="performance"><a>Performance</a></li>
</ul>

<div class="strategy">This copy shows when the li is clicked on</div>

这是我试图用js

隐藏给定网址的div
var jQ = jQuery.noConflict();
jQ(document).ready(function() { 
    var url = document.location.href;

    if (url.indexOf('http://localhost:8888/site/funds/#tabbed-nav=fund-strategy') >= 0) {
        jQ('.fourth').hide();
    };
});


<div class="fourth">Hide me please!</div>

2 个答案:

答案 0 :(得分:1)

试着使用这样的东西:

var currentHash = window.location.hash;
if (currentHash=="#tabbed-nav=fund-strategy") {
   $('.fourth').hide();
}

确保html代码中有一个带有'4th'类的html元素。否则这不会隐藏任何东西。

答案 1 :(得分:0)

我想我确定了这个问题。 zozo选项卡使用hashchange。因此,在撞到墙壁后,我的用户可以获得巨大的灵感。我下载了ba.hashchange并将给定的答案包装在一个hashchange函数中,如果有人感兴趣,这里是代码。这似乎有效。

var jz = jQuery.noConflict();
jz(function(){
  jz(window).hashchange( function(){
  // Alerts every time the hash changes!
    var hash = document.location.hash;

    if (hash == '#tabbed-nav=risk' || hash == '#tabbed-nav=fund-strategy') {
        jz('.fourths').show();  
    } else {
        jz('.fourths').hide();  
    }

})
   jz(window).hashchange();

 });