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