如何修改jscript以防止一个特定的链接滚动? [英] How to modify jscript to prevent one specific link from scrolling?

问题描述

我正在使用此代码在页面内滚动.基本上检查内部链接，如果它们是间隔的，则添加平滑滚动:

I am using this code for scrolling inside the page. Basically checks for internal links, if they are interval, adds a smooth scrolling:

<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) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});
</script>

但是，我在同一页面上也有幻灯片放映.这使用来自Bootstrap的Carousel .此代码与幻灯片冲突，我想为此href禁用平滑滚动.

However, I also have a slideshow in the same page. This uses Carousel from Bootstrap. This code clashes with the slideshow and I would like to disable smooth scrolling for this href.

如何添加代码以防止这种冲突?

How can I add a code to prevent this clash?

推荐答案

修改选择器，以明确排除幻灯片中的所有锚元素.假设幻灯片位于ID为#slideshow的元素中(例如):

Modify your selector to explicitly exclude any anchor elements inside your slideshow. Assuming the slideshow is in an element with the id #slideshow (as an example):

$('a[href*=#]:not([href=#], #slideshow a)').click(function() {

尽管我个人认为使用.not()方法而不是使用:not()选择器更容易阅读(因为语法颜色突出显示适用于方法，但不能在单个字符串中显示):

Though personally I find it more readable to use the .not() method rather than the :not() selector (because syntax colour highlighting works on methods but not inside a single string):

$('a[href*=#]').not("[href=#], #slideshow a").click(function() {

这篇关于如何修改jscript以防止一个特定的链接滚动?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！