从下拉菜单更改引导模式选项卡(同一页面)

时间:2017-06-13 14:00:22

标签: javascript jquery html twitter-bootstrap

尝试从同一页面上的引导标签的下拉菜单中更改标签。

这是下拉菜单代码:

<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
 <li><a class="menu-link" href="/menuu/#day">Day</a></li>
 <li><a class="menu-link" href="/menuu/#night">Night</a></li>
 <li><a class="menu-link" href="/menuu/#drinks">Joogid</a></li>
 <li><a class="menu-link" href="/menuu/#takeaway">Takeaway</a></li>
</ul>

这里是jQuery,我试图摆脱链接中的/ menuu /以及什么都没有替换它。

<script>
  $(function () {
    $('.menu-link').click(function (e) {
        e.preventDefault();
         var str = this.href;
         this.href = str.replace('/menuu/', '');
        $('a[href="' + $(this).attr('href') + '"]').tab('show');
    })
});
</script>

我的代码不幸地工作。有什么建议吗?

1 个答案:

答案 0 :(得分:1)

这应该对你有帮助..

&#13;
&#13;
  $('.menu-link').each(function(e) {
    $(this).attr('href', $(this).attr("href").replace( /\/menuu\//gi, '' ) );
  });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="row">
    <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
      <li><a class="menu-link" href="/menuu/#day">Day</a></li>
      <li><a class="menu-link" href="/menuu/#night">Night</a></li>
      <li><a class="menu-link" href="/menuu/#drinks">Joogid</a></li>
      <li><a class="menu-link" href="/menuu/#takeaway">Takeaway</a></li>
    </ul>
   </div>
</div>
&#13;
&#13;
&#13;