WordPress有条件地加载一个缩小脚本

Question

我有一个脚本，我只想在某人在特定页面上时要加载

我像这样加载脚本 function.php ：

function my_assets() {
wp_enqueue_script( 'footerlinks', get_stylesheet_directory_uri() . '/js/footerlinks.js', array( 'jquery' ), '1.0', true );
wp_enqueue_script( 'gallery', get_stylesheet_directory_uri() . '/js/gallery.js', array( 'jquery' ), '1.0', true );
wp_enqueue_script( 'about', get_stylesheet_directory_uri() . '/js/about.js', array( 'jquery' ), '1.0', true );
wp_enqueue_script( 'legal', get_stylesheet_directory_uri() . '/js/legal.js', array( 'jquery' ), '1.0', true );

if ( !is_page( 490 ) ) {
        wp_dequeue_script('about');
}
if ( !is_page( 29804 ) ) {
        wp_dequeue_script('legal');
}
if ( !is_page( 24574 ) ) {
        wp_dequeue_script('gallery');
}
}
    add_action( 'wp_enqueue_scripts', 'my_assets' );

此代码有效，但我也在缩小和串联脚本。当我执行此部分时，脚本不会变得工作，但是它仍然在页面上加载而没有任何错误。

这是脚本 Legal.js ：

<!-- Script for making legal blurbs clickable to display one at a time -->
jQuery(document).ready(function(){
    jQuery(".legaltab").hide();
    console.log("legal script running");
    var tprivacy = document.createAttribute("target");
    var ttc = document.createAttribute("target");
    var tdisclaimer = document.createAttribute("target");
    var bprivacy = document.getElementById("bprivacy");
    tprivacy.value = "sprivacy";
    bprivacy.setAttributeNode(tprivacy);
    var btc = document.getElementById("btc");
    ttc.value = "stc";
    btc.setAttributeNode(ttc);
    var bdisclaimer = document.getElementById("bdisclaimer");
    tdisclaimer.value = "sdisclaimer";
    bdisclaimer.setAttributeNode(tdisclaimer);

    jQuery(".legalblurb").click(function(){
    console.log("inside link button function");
        jQuery(".legaltab").hide();
        jQuery("#"+ jQuery(this).attr("target") ).show();
    }); 
});

我是否会错误地加载它们？其他一些问题讨论了Gulp或Grunt，但我不确定它们是否是同一件事。

Answer 1

您的JS中有错误。例如，在legal.js中，您有：

<!-- Script for making legal blurbs clickable to display one at a time -->

在JavaScript中添加注释的正确方法是

// Script for making legal blurbs clickable to display one at a time

或

/* Script for making legal blurbs clickable to display one at a time */

我看了您在网站上的JS的汇编JS，并在JS中看到了另一个不好的评论：

<!--Script for footer links that take you everywhere else-->

我建议您使用JavaScript strict mode并使用jshint测试您的代码。这将大大减少缩小错误。

legal.js的清理版本是：

/*globals jQuery*/
/* Script for making legal blurbs clickable to display one at a time */
jQuery(document).ready(function($){
   'use strict';
    $(".legaltab").hide();
    console.log("legal script running");
    var tprivacy = document.createAttribute("target");
    var ttc = document.createAttribute("target");
    var tdisclaimer = document.createAttribute("target");
    var bprivacy = document.getElementById("bprivacy");
    tprivacy.value = "sprivacy";
    bprivacy.setAttributeNode(tprivacy);
    var btc = document.getElementById("btc");
    ttc.value = "stc";
    btc.setAttributeNode(ttc);
    var bdisclaimer = document.getElementById("bdisclaimer");
    tdisclaimer.value = "sdisclaimer";
    bdisclaimer.setAttributeNode(tdisclaimer);

    $(".legalblurb").click(function(){
    console.log("inside link button function");
        $(".legaltab").hide();
        $("#"+ $(this).attr("target") ).show();
    }); 
});

Answer 2

这对您来说很奇怪，为什么不这样做：

wp_register_script( 'gallery', get_stylesheet_directory_uri() . '/js/gallery.js', array( 'jquery' ), '1.0', true );
if ( is_page( 24574 ) ) {
    wp_enqueue_script('gallery');
}

基于WP_ENQUEUE_SCRIPT函数

Answer 3

首先检查是否使用任何缓存插件。如果您使用任何类似插件，请禁用它。清除您的浏览器缓存。之后使您的代码这样

wp_register_script( 'gallery', get_stylesheet_directory_uri() . '/js/gallery.js', array( 'jquery' ), '1.0', true );
if ( is_page( 'gallery' ) ) {
    wp_enqueue_script('gallery');
}

它应该对您有用。