jQuery滚动到锚点-仅定位某些链接

Question

我在Sharepoint上实现了以下脚本：

<script>

$(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('#s4-workspace').animate({
          scrollTop: target.offset().top
        }, 2000);
        return false;
      }
    }
  });
});</script>

效果很好，除了现在，所有超链接（例如，某些Bootstrap选项卡链接）都将触发脚本。

如何使以上脚本仅在以下链接中起作用：＃mission，＃vision，＃strategy？

谢谢！

Answer 1

更改选择器：

$('a[href^="#"]')

或者您可以使用.filter() ：

$('a[href]').filter(function() {
  var rg = /\#+\w/g; // this makes sure to select all the anchors with "href='#word'"
  return rg.test(this.hash) === true;
}).click(function() {
    // all the functionality as is
});

请查看以下示例演示：

 $('a[href]').filter(function() { var rg = /\\#+\\w/g; return rg.test(this.hash) === true; }).css('color', 'red') 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href='#what'>#what</a> <a href='http://hehehe.com'>http://</a> <a href='#how'>#How</a> 

Answer 2

你可以尝试像这样使用它

$('#mission[href*="#"]:not([href="#"]), #vision[href*="#"]:not([href="#"]), #strategy[href*="#"]:not([href="#"])')

CSS选择器测试演示

和Js选择器测试DEMO