bootstrap的nav导航for 循环生成添加的点击收起事件不管用

image.png
项目是适配pc和移动端的,点击展开导航栏,选择某一分类,导航栏应该是收起。
当我的导航栏是写死的是时候是可以收起的,但是如果用for循环生成的话就不能。这个导航分类我们是后台做的动态的可以修改,所以这个地方是动态的。

<nav class="navbar navbar-default navbar-fixed-top white no-background bootsnav on no-full">
<div class="container">
 <div class="navbar-header">
   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
     <span class="sr-only">导航条</span>
     <span class="icon-bar"></span>
     <span class="icon-bar"></span>
     <span class="icon-bar"></span>
   </button> 
</div>
<div class="collapse navbar-collapse">
  <ul class="nav navbar-nav" id="nav-list">
   <li>
       <a @click="jumpToHomePage()">首页</a>
   </li>
   <li v-for="(itemNav , indexNav) in topHeadData" :key="indexNav">
    <a @click="jumpToList(itemNav.name)">{{itemNav.name}}</a>
    </li>
    <li>
     <a @click="jumpPer()" target="_black">个人中心</a>
    </li>
  </ul>
</div>
 </div>
</nav> 

// app端时,点击导航栏收起
var navBlock = document.querySelector(".navbar-toggle");

  $(".navbar-nav li a").on("click",function () {
    navBlock.click();
});

阅读 2.2k
1 个回答

你这元素是循环生成的,不是默认生成的,你这样写绑定不到,要用:

<a @click="jumpToList(itemNav.name)" class="js_link">{{itemNav.name}}</a>
$(".navbar-nav").on("click",'.js_link',function () {
    navBlock.click();
});
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题