如何修复我的旧主题以便正确加载jQuery

时间：2011-11-30 作者：ted.strauss

我有一个旧主题是“手动”加载jQuery，这与所有尝试使用jQuery的插件冲突。主题标题中包含以下行：

<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery.inputs.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery.scrollpane.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery.mousewheel.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/jquery.lightbox-0.5.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/swfobject.js"></script>
<script type="text/javascript" src="<?php bloginfo(\'template_url\'); ?>/js/functions.js"></script>

我知道我应该调用本地WordPress挂钩来加载这些文件，但我不知道具体步骤。你能帮忙吗？对不起，我没有生气。

4 个回复

最合适的回答,由SO网友:Chip Bennett 整理而成

尝试一个普遍的答案，因为我们（还没有？）可以访问特定主题。

Note: all of these edits can - and perhaps should - be implemented via Child Theme.

首先，您需要从header.php. 脚本应该排队，而不是硬编码到模板中。

然后，您需要将以下内容添加到functions.php:

<?php
function wpse35169_enqueue_scripts() {
    // Enqueue WP-core bundled scripts
    wp_enqueue_script( \'jquery\' );
    wp_enqueue_script( \'swfobject\' );
    // Enqueue custom scripts
    wp_enqueue_script( \'jquery-inputs\', get_template_directory_uri() . \'/js/jquery.inputs.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'jquery-scrollpane\', get_template_directory_uri() . \'/js/jquery.scrollpane.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'jquery-mousewheel\', get_template_directory_uri() . \'/js/jquery.mousewheel.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'jquery-easing\', get_template_directory_uri() . \'/js/jquery.easing.1.3.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'jquery-lightbox\', get_template_directory_uri() . \'/js/jquery.lightbox-0.5.js\' );
    wp_enqueue_script( \'wpse35169-functions\', get_template_directory_uri() . \'/js/functions.js\' );
}
// Hook into \'wp_enqueue_scripts\'
add_action( \'wp_enqueue_scripts\', \'wpse35169_enqueue_scripts\' );
?>

如果您需要灯箱或函数的特定依赖项/加载顺序。js，只需添加适当的$deps 阵列到wp_enqueue_script() 呼叫

这应该可以解决你的问题，但是，如果不知道你在使用什么主题，我不能百分之百肯定。

SO网友:ptriek

将以下代码添加到函数中。每个脚本的php：

wp_enqueue_script(\'handle\',  get_bloginfo(\'stylesheet_directory\').\'/path/to/script.js\', array(\'dependencies\'));

例如：

wp_enqueue_script(\'jquery\',  get_bloginfo(\'stylesheet_directory\').\'/js/jquery-1.7.1.min.js\');

依赖关系仅适用于依赖于其他脚本的脚本，因此您需要为所有需要jquery的脚本填写“jquery”。

参考号：http://codex.wordpress.org/Function_Reference/wp_enqueue_script

SO网友:stacigh

我会使用谷歌的jquery副本，而不是捆绑的wordpress版本。主要优势在于，大多数网站都使用谷歌代码，这样用户就不必再加载jquery的另一个副本，因为他们可以只使用缓存的脚本。

    // Load jQuery
   if ( !is_admin() ) {
      wp_deregister_script(\'jquery\');
      wp_register_script(\'jquery\', ("https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"), false);
      wp_enqueue_script(\'jquery\');

}

从那里，我会按照Chip的建议将您的自定义脚本排队。

SO网友:Chris_O

有趣的新方法，注册和排队您的主题脚本。还可以在需要时更轻松地添加和删除新脚本。

/**
 *  Registers javascript using wp_register_script
 *
 * \'$handle\' => array(
 * \'remote\'  => boolean (true|false),   //optional default false 
 * \'src\'     => \'file_name.js\',         //string required
 * \'deps\'    => \'dependencies\',         //string optional 
 * \'footer\'  => boolean (true|false)    //optional default false
 */

function scripts() {    
$deregister = array(
    \'jquery\' => array() 
);
$scripts = array(       
    \'jquery\'    => array(
        \'remote\'    => true,
        \'src\'       => \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js\',
        \'deps\'      => null,        
        ),
     \'jquery.cycle\' => array(
         \'remote\'   => false,
         \'src\'      => \'jquery-cycle/jquery.cycle.min.js\',
         \'deps\'     => \'jquery\'
     ),
     \'jquery.jcarousel\' => array(
         \'remote\'   => false,
         \'src\'      => \'jquery.jcarousel.min.js\',
         \'deps\'     =>  \'jquery\'
     ),     
    \'functions\' => array(
        \'src\'       => \'functions.js\',
        \'deps\'      => \'jquery\',
        \'footer\'    => true,
        )
);  
foreach ( $deregister as $key => $handle ) :
    if ( ! is_admin() ) :
        wp_deregister_script( $key );   
    endif;      
endforeach;

foreach ( $scripts as $key => $value ) :

if ( is_admin() ) return;

  if ( is_array( $value ) && array_key_exists( \'src\', $value ) ) :

    $src = !empty( $value[ \'remote\' ] ) ? $value[ \'src\' ] : THEME_JS_URI . $value[ \'src\' ];

        if ( ! $value[\'deps\'] == null ) :
            wp_register_script( $key, $src, $value[ \'deps\' ], false, !empty( $value[ \'footer\' ] ) );

        else : wp_register_script( $key, $src, false, !empty( $value[ \'footer\' ] ) );
    endif;     
        else : wp_register_script( $key, THEME_JS_URI . $src, $value, false );

  endif;

    wp_enqueue_script( $key );

endforeach;

 }

结束

小码农CODE

如何修复我的旧主题以便正确加载jQuery

相关推荐

在插件中混合使用常规的Java脚本和jQuery