Question

所以我正在使用Wordpress中的自定义主题。我以前在 head.php 中有很多JS，如下所示：

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

    $('.widgetblock').accordion({
        //args
    });


    if ( have_posts() ) {
        //stuff
    }
});

但是我已经读过，在Wordpress中添加JS的正确方法是在 functions.php 中使用wp_enqueue_script()，所以我＆＃ 39;我试图这样做。我所做的只是将相同的代码放入我已保存在相应文件夹中的.js文件中，然后我就像这样加载它：

function script_assets() {
    wp_enqueue_script( 'js-code', get_template_directory_uri() . '/js/js-code.js', array( 'jquery', 'jquery-ui-widget' ) );
}

add_action( 'wp_enqueue_scripts', 'script_assets' );

我已将JQuery和JQuery UI添加为依赖项。

但是，这不起作用。 Chrome表示没有定义accordion（）和have_posts（）。如果我尝试从CSS中引用特定元素，我也会遇到问题。

那么，我该怎么办？这可能是一个非常基本的问题，但我找不到如何解决它。

另一个问题是，我如何100％确定在CSS之后加载了一些JS脚本？我正在使用-prefix-free，它应该在它之后加载，但我不确定wp_enqueue是否可能... 编辑：我无法在页脚中加载该脚本，需要在CSS后立即加载。：/

感谢。

Answer 1

每次我必须将jQuery添加到WordPress网站时，我都会使用我在CSS-tricks上找到的代码

if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
 function my_jquery_enqueue() {
 wp_deregister_script('jquery');
 wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js", false,    null);
 wp_enqueue_script('jquery');
}

根据我的理解，一旦你以这种方式加载jQuery，你就可以防止冲突并且只加载一次。

Answer 2

其他人发布了答案但后来将其删除了......

我在这里使用的依赖wp_enqueue_script( 'js-code', get_template_directory_uri() . '/js/js-code.js', array( 'jquery', 'jquery-ui-widget' ) );是错误的;我应该使用jquery-ui-accordion，jquery-ui-widget不包括。我选择包括整个jquery-ui（所以我可以使用其他功能而不必为每个功能添加特定的依赖项）但是为了做到这一点，我必须链接到Google，因为没有完整的包WP。

修复了我的一些问题，而不是所有问题（-prefix-free脚本仍然没有在样式表之后加载，我必须找到替换之前使用过的PHP函数的方法）但是网站的工作，所以：）

感谢实际回答的任何人，我不记得您的用户名，抱歉。

如何将JS添加到Wordpress并引用CSS或其他脚本？

2 个答案: