衝突的腳本不能正常工作

我已經使用腳本中聲明的兩個腳本。每個腳本在單獨聲明時都能很好地工作，但如果我聲明第二個腳本。另一個功能另一個不行。衝突的腳本不能正常工作

以下是在單獨聲明並與其他腳本一起聲明的代碼。這有他自己的js文件。

var fixed = false; 

$(document).scroll(function() { 
    if($(this).scrollTop() > 20) { 
     if(!fixed) { 
      fixed = true; 
      $('.navbar-fixed-top').addClass('scroll'); 

     } 
    } else { 
     if(fixed) { 
      fixed = false; 
      $('.navbar-fixed-top').removeClass('scroll'); 

     } 
    } 
}); 

/* 
* Smooth Scroll 
*/ 


$(function() { 

     function filterPath(string) { 
      return string 
      .replace(/^\//,'') 
      .replace(/(index|default).[a-zA-Z]{3,4}$/,'') 
      .replace(/\/$/,''); 
     } 

     var locationPath = filterPath(location.pathname); 
     var scrollElem = scrollableElement('html', 'body'); 

     // Any links with hash tags in them (can't do ^= because of fully qualified URL potential) 
     $('a[href*=#]').each(function() { 

      // Ensure it's a same-page link 
      var thisPath = filterPath(this.pathname) || locationPath; 
      if ( locationPath == thisPath 
       && (location.hostname == this.hostname || !this.hostname) 
       && this.hash.replace(/#/,'')) { 

        // Ensure target exists 
        var $target = $(this.hash), target = this.hash; 
        if (target) { 

         // Find location of target 
         var targetOffset = $target.offset().top; 
         $(this).click(function(event) { 

          // Prevent jump-down 
          event.preventDefault(); 

          // Animate to target 
          $(scrollElem).animate({scrollTop: targetOffset}, 400, function() { 

           // Set hash in URL after animation successful 
           location.hash = target; 

          }); 
         }); 
        } 
      } 

     }); 

     // Use the first element that is "scrollable" (cross-browser fix?) 
     function scrollableElement(els) { 
      for (var i = 0, argLength = arguments.length; i <argLength; i++) { 
       var el = arguments[i], 
       $scrollElement = $(el); 
       if ($scrollElement.scrollTop()> 0) { 
        return el; 
       } else { 
        $scrollElement.scrollTop(1); 
        var isScrollable = $scrollElement.scrollTop()> 0; 
        $scrollElement.scrollTop(0); 
        if (isScrollable) { 
         return el; 
        } 
       } 
      } 
      return []; 
     } 

    });

另一個是在第一個腳本下方聲明的。現在當另一個存在時這不起作用，但是當單獨工作時是完美的。我也嘗試過沒有衝突的腳本，但結果相同。

<script> 
$(document).ready(function(){ 

$(function(){ 
    document.querySelector("#nav-toggle") 
    .addEventListener("click", function() { 
     this.classList.toggle("active"); 
     $(".navmobile").slideToggle(); 
}); 
}); 
     $(window).resize(function() { 
     if ($(window).width() >= 767) { 
     $(".navmobile").hide(); 
     } 
     else { 
    $("#nav-toggle").removeClass("active"); 
    $(".navmobile").hide(); 
    } 
    }); 
}); 
</script>

來源

2016-01-26 MIke

*「另一個功能沒有。」*我不知道這意味着什麼。 – epascarello

腳本不能一起工作。 1工作，而另一個不工作。只有一個函數在聲明時才起作用。 – MIke

所以你需要弄清楚爲什麼。似乎兩個人都在錨上工作，所以我猜你需要排除其他人使用的錨。 – epascarello

你可能有這樣的元素在你的代碼：

<a href="#" id="nav-toggle"></a>

注意href="#"部分 - 第一個腳本使用event.preventDefault()爲每一個元素與HREF含有「＃」，所以第二個腳本沒有得到點擊事件。 從該元素中刪除href="#"（或者將該屬性留空），它應該可以工作。

來源

2016-01-26 04:18:33

是的錯誤是我有該代碼。 ''但刪除href並不能解決任何問題 – MIke

變化

// Any links with hash tags in them (can't do ^= because of fully qualified URL potential) 
$('a[href*=#]').each(function() {

到

// Any links with hash tags in them (can't do ^= because of fully qualified URL potential) 
$('a[href*=#]').not("#av-toggle").each(function() {

所以第一個腳本忽略你點擊做反覆的鏈接。

來源

2016-01-26 05:55:10 epascarello

衝突的腳本不能正常工作

回答

相關問題