在JavaScript文件中有条件地加载js的部分Wordpress

Question

不是100％确定这是可能的。我试图在Wordpress网站上的JS文件中加载某些jQuery部分。所以我有一个custom.js文件来控制各种jQuery函数。是否可以有条件地加载文件的某些部分？

我知道你可以排队完整的js文件。但我想加载1个js文件中的部分。

例如

jQuery(document).ready(function($) { 

    //LOAD THIS ON ALL PAGES 
    (function($) { 
     $(function() { 
     $('.toggle-overlay').click(function() { 
      $('aside').toggleClass('open'); 
      $('.header-wrapper').toggleClass('open'); 
      $('.button-container').toggleClass('active'); 
     }); 
     }); 
    })(jQuery); 


    //LOAD THIS ON ALL PAGES 
    $(window).scroll(function() {  
     var scroll = $(window).scrollTop(); 

     if (scroll >= 50) { 
      $(".header-wrapper").addClass("fixed"); 
     } else { 
      $(".header-wrapper").removeClass("fixed"); 
     } 
    }); 


    //LOAD THIS ON CONTACT PAGE ONLY 
    $(window).scroll(function() {  
     var scroll = $(window).scrollTop(); 
     $('.header-single-image h1, .header-single-image h2, .header-single-image a, .header-single-image .services, .header-single-image .scroll-down-link').css({'opacity':((500-scroll)/500)}); 
    }); 


    //LOAD THIS ON ALL PAGES 
    $('a[href^="#"]').on('click',function (e) { 
     e.preventDefault(); 

     var target = this.hash; 
     var $target = $(target); 

     $('html, body').stop().animate({ 
      'scrollTop': $target.offset().top 
     }, 900, 'swing', function() { 
      window.location.hash = target; 
     }); 
    }); 


    //LOAD THIS ON SINGLE POST PAGES ONLY 
    $('ul.tabs li').click(function(){ 
     var tab_id = $(this).attr('data-tab'); 

     $('ul.tabs li').removeClass('current'); 
     $('.tab-content').removeClass('current'); 

     $(this).addClass('current'); 
     $("#"+tab_id).addClass('current'); 
    }) 


    //LOAD THIS ON ABOUT PAGE ONLY 
    $.each($(".cs-filter label"), function(index, value){ 
     var num = index + 1; 
     $(value).attr("class","label"+ num); 
    }); 

}); 

或者我需要去除部分我想有条件地加载和有条件地加载它们在相关页面的页脚？

感谢

Answer 1

是的，你可以做条件装载这种方法（假设该页面的位置是 '/约'）：

$(function() { 
    // only execute this block if we are on the /about page 
    if (window.location.pathname == '/about') { 
    $.each($(".cs-filter label"), function(index, value){ 
    var num = index + 1; 
     $(value).attr("class","label"+ num); 
    }); 
    } 
} 

编辑：

如果您需要执行块在单个帖子页面上，你将不得不使用正则表达式。假设单个帖子页面具有url方案：/年/月/日/标题，我们可以使用以下内容：

if (/(\d+\/){3}/.test(window.location.pathname)) { 
    //LOAD THIS ON SINGLE POST PAGES ONLY 
    $('ul.tabs li').click(function(){ 
    var tab_id = $(this).attr('data-tab'); 

    $('ul.tabs li').removeClass('current'); 
    $('.tab-content').removeClass('current'); 

    $(this).addClass('current'); 
    $("#"+tab_id).addClass('current'); 
    }) 
}