导航栏使用js。链接不工作

时间:2016-12-19 14:47:23

标签: javascript html

我已经下载了一个导航栏模板,并努力让它按照我的意愿运行。单击标题时,将打开子菜单以进一步链接。我不希望所有标题打开子菜单,我想要一些只是一个链接I.E home。

当点击主页时,它会突出显示主页,就像打开子菜单一样,并没有转到链接。我认为这是一个js问题。

下面是html:

<nav id="cbp-hrmenu" class="cbp-hrmenu">

                    <ul>
                                <li>
                            <a href="home.php">Home</a>

                        <li>
                            <a href="#">Club Information</a>
                            <div class="cbp-hrsub">
                                <div class="cbp-hrsub-inner">
                                    <div>
                                        <h4>About the Club</h4>
                                        <ul>
                                            <li><a href="about.php">About IDMC</a></li>
                                            <li><a href="location.php">Where to Find Us</a></li>
                                            <li><a href="whatwedo.php">What We Do</a></li>
                                        </ul>
                                        <h4>Contacting Us</h4>
                                        <ul>
                                            <li><a href="contactus.php">General Information</a></li>
                                        </ul>
                                    </div></div><!-- /cbp-hrsub-inner -->
                            </div><!-- /cbp-hrsub -->
                        </li>
                    </ul>
                </nav>

我相信这是导致问题的js,但不确定要改变什么:

var cbpHorizontalMenu=(function(){var b=$("#cbp-hrmenu > ul > li"),g=b.children("a"),c=$("body"),d=-1;function f(){g.on("click",a);b.on("click",function(h){h.stopPropagation()})}function a(j){if(d!==-1){b.eq(d).removeClass("cbp-hropen")}var i=$(j.currentTarget).parent("li"),h=i.index();if(d===h){i.removeClass("cbp-hropen");d=-1}else{i.addClass("cbp-hropen");d=h;c.off("click").on("click",e)}return false}function e(h){b.eq(d).removeClass("cbp-hropen");d=-1}return{init:f}})();

1 个答案:

答案 0 :(得分:0)

您想要排除只是链接的项目,而不是下拉列表。因此,在没有子项的链接中添加一个link类。 <a href="home.php" class="link">Home</a>

然后将Javascript更改为如下所示:代码不应该在链接类的链接上运行。

var cbpHorizontalMenu=(function(){
  var b=$("#cbp-hrmenu > ul > li"), g=b.children("a").not($('.link')), c=$("body"), d=-1;
  function f(){
    g.on("click",a);
    b.on("click", function(h){
      h.stopPropagation();
    })
  }
  function a(j){
    if(d!==-1){
      b.eq(d).removeClass("cbp-hropen");
    }
    var i=$(j.currentTarget).parent("li"), h=i.index();
    if(d===h){
      i.removeClass("cbp-hropen");
      d=-1
    }else{
      i.addClass("cbp-hropen");
      d=h;
      c.off("click").on("click",e);
    }
    return false
  }
  function e(h){
    b.eq(d).removeClass("cbp-hropen");
    d=-1
  }
  return {init:f}
 })();