WordPress:使用入队加载多个脚本 [英] WordPress: Loading multiple scripts with enqueue

问题描述

我正在尝试将jQuery和其他脚本加载到页眉(或者应该是页脚)中，并且使jQuery工作正常，可以使警报框运行.

I'm trying to load jQuery and other scripts into the header (or should it be footer), and I have the jQuery working sort of I can get an alert box running.

问题是，jquery-2.0.3.min.js没有加载，而且我不知道我是否正确地进行了排队.虽然jquery-1.10.2已加载.而且，另一个脚本也没有加载.对于两个脚本(2.0.3和其他脚本)，该命令都位于末尾:?ver=3.6.1

The thing is, jquery-2.0.3.min.js isn't loading, and I don't know if I'm doing the enqueue correctly. jquery-1.10.2 is loaded though. And also, the other script isn't loading either. For both scripts (2.0.3 and other script), this is at the end: ?ver=3.6.1

我还读到将两个函数都加载到一个函数中可能更好?

Also I was reading that it might be better load both into one function?

因此，我们将不胜感激！

So, any help would be appreciated!

function load_jquery() {
    wp_register_script( 'jquery_script', get_template_directory_uri() . 'js/jquery-2.0.3.min.js', array( 'jquery' ) );
    wp_enqueue_script( 'jquery_script' );
}
add_action( 'init', 'load_jquery' ); // end jQuery

function another() {
    wp_register_script( 'another_script', get_template_directory_uri() . 'js/another.js', array( 'jquery' ) );
    wp_enqueue_script( 'another_script' );

}
add_action( 'init', 'another' );

推荐答案

默认情况下，wordpress中的第一件事是jQuery，因此您不必注册它，只需将其排队

First thing jquery in there by default in wordpress so you dont have to register it , just enqueue it

大多数jquery ui库和核心jquery文件已经在wordpress中注册，因此您只需要使用正确的句柄入队即可.入队脚本

most of the jquery ui libs and core jquery files are already registered with wordpress so you only need to enqueue with right handle look here enqueue script

wp_enqueue_script用于排队脚本，而wp_enqueue_style用于排队样式

wp_enqueue_script is used to enqueue script and wp_enqueue_style is used to enqueue style

用于调用自定义js，最好在使用前先注册脚本或样式

for calling custom js, its better to register script or style first before using

wp_register_script//注册脚本

wp_register_style//注册样式

然后使用wp_enqueue_script，wp_enqueue_style

这是我网站上整个过程的示例代码片段

here is a sample code snippet for whole process from my site

function pr_scripts_styles() {

    wp_enqueue_script('jquery'); // just enqueue as its already registered 
    if ( is_singular() && comments_open() && get_option( 'thread_comments' ) )
        wp_enqueue_script( 'comment-reply' );

    /*   REGISTER ALL JS FOR SITE */
    wp_register_script('pr_cycle_all',get_stylesheet_directory_uri().'/js/pr-slider.js');
    wp_register_script('pr_slider',get_stylesheet_directory_uri().'/js/jquery.cycle.all.min.js');
    wp_register_script('pr_validation_engine',get_stylesheet_directory_uri().'/js/jquery.validationEngine-en.js');
    wp_register_script('pr_validation_locale',get_stylesheet_directory_uri().'/js/jquery.validationEngine.js');
    wp_register_script('stylethemes',get_stylesheet_directory_uri().'/js/stylethemes.js');
    wp_register_script('pr-jquery-ui',get_stylesheet_directory_uri().'/js/jquery-ui.js');
    wp_register_script('main-js',get_stylesheet_directory_uri().'/js/main.js');
    wp_register_script('pr-galleriffic',get_stylesheet_directory_uri().'/js/jquery.galleriffic.js');
    wp_register_script('pr-rollover',get_stylesheet_directory_uri().'/js/jquery.opacityrollover.js');
    wp_register_script('pr_colorbox',get_stylesheet_directory_uri().'/js/jquery.colorbox.js');
    wp_register_script('pr_jcarousel_js',get_stylesheet_directory_uri().'/js/jquery.jcarousel.min.js');


    //wp_register_script('google-map-api','https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false');



    /*   REGISTER ALL CSS FOR SITE */
    wp_register_style('pr_woocommerce',get_stylesheet_directory_uri().'/css/_woocommerce.css');
    wp_register_style('pr_mobile',get_stylesheet_directory_uri().'/css/mobile.css');
    wp_register_style('pr_sec_teal_grey',get_stylesheet_directory_uri().'/css/secondary-teal-grey.css');
    wp_register_style('pr_site_options',get_stylesheet_directory_uri().'/css/site-options.css');
    wp_register_style('pr_teal_grey',get_stylesheet_directory_uri().'/css/teal-grey.css');
    wp_register_style('validation_css',get_stylesheet_directory_uri().'/css/validationEngine.jquery.css');
    wp_register_style('galleriffic_css',get_stylesheet_directory_uri().'/css/galleriffic.css');
    wp_register_style('pr_colorbox_style',get_stylesheet_directory_uri().'/css/colorbox.css');
    wp_register_style('pr_jcarousel_css',get_stylesheet_directory_uri().'/css/jcarouselskin.css');



    /*   CALL ALL CSS AND SCRIPTS FOR SITE */
    wp_enqueue_script('pr-jquery-ui');
    wp_enqueue_script('stylethemes');

    wp_enqueue_script('pr_cycle_all');

    wp_enqueue_script('pr_slider','','','',true);
    wp_enqueue_script('pr_validation_engine');
    wp_enqueue_script('pr_validation_locale');
    wp_enqueue_script('google-map-api');
    wp_enqueue_script('main-js');
    wp_enqueue_script('pr-galleriffic');
    wp_enqueue_script('pr-rollover');
    wp_enqueue_script('pr_colorbox');


    wp_enqueue_style( 'pr-style', get_stylesheet_uri(), array(), '2013-07-18' );
    wp_enqueue_style('pr_site_options');
    wp_enqueue_style('pr_woocommerce');
    wp_enqueue_style('pr_mobile');
    wp_enqueue_style('pr_sec_teal_grey');
    wp_enqueue_style('pr_teal_grey');
    wp_enqueue_style('validation_css');
    wp_enqueue_style('galleriffic_css');
    wp_enqueue_style('pr_colorbox_style');
    if(is_single()){
        wp_enqueue_script('pr_jcarousel_js');
        wp_enqueue_style('pr_jcarousel_css');
    }
}
add_action( 'wp_enqueue_scripts', 'pr_scripts_styles' );

还请记住将函数与wp_enqueue_scripts挂钩，以便脚本&样式正确加载add_action( 'wp_enqueue_scripts', 'pr_scripts_styles' );

also remember to hook your function with wp_enqueue_scripts so that scripts & style load correctly add_action( 'wp_enqueue_scripts', 'pr_scripts_styles' );

这篇关于WordPress:使用入队加载多个脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！