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


项目是适配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();
});

回答

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

<a @click="jumpToList(itemNav.name)" class="js_link">{{itemNav.name}}</a>
$(".navbar-nav").on("click",'.js_link',function () {
    navBlock.click();
});

以上是 bootstrap的nav导航for 循环生成添加的点击收起事件不管用 的全部内容， 来源链接： utcz.com/a/42302.html

回到顶部