Enqueue jQuery in WordPress

时间:2012-07-29 作者:Ant

在Wordpress 3.4.1中从头开始构建我的第一个主题,我知道Wordpress已经通过Google获得了最新版本的JQuery。我已经读到了关于脚本调用不正确的问题,所以我想尝试将所有内容尽可能接近推荐的编码。我想确保脚本已加载,我相信这是由下面的PHP脚本在函数中执行的。php文件(摘自Wordpress Codex)。

<?php
function my_scripts_method() {
wp_enqueue_script( \'jquery\' );
}
我希望基本上使用JQuery有一个自定义菜单,那么这只是将我想要激活的脚本放在标题或PHP部分的一种情况吗?

此外,如果我想将Wordpress中尚未包含的另一个脚本排队,那么我只需将下面的PHP添加到函数中的上述代码中即可。php文件?

wp_register_script( \'jqueryexample\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\');
我可以使用HTML和CSS,但PHP和JAVA对我来说相对较新,非常感谢您的帮助。

谢谢

蚂蚁

2 个回复
最合适的回答,由SO网友:W van Dam 整理而成

你走在正确的轨道上,但遗漏了一点:

add_action(\'wp_enqueue_scripts\', \'my_scripts_method\');
add\\u操作允许您在页面加载/特定事件期间的特定时间运行代码。上面的操作告诉WP在向html head元素添加脚本时运行您的函数。您的函数依次指示WP添加jQuery脚本。

注册新脚本也是如此,但使用不同的挂钩:

add_action(\'wp_enqueue_scripts\', \'my_register_script_method\');

function my_register_script_method () {
    wp_register_script( \'jqueryexample\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\');
}
如果要覆盖预注册的脚本,还应首先取消该脚本的注册。我使用类似于以下代码的代码来替换jquery脚本(注意:请阅读末尾的第二次编辑):

function my_register_script_method () {
    wp_deregister_script(\'jquery\');
    wp_register_script( \'jquery\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\');
}
至于你应该把代码放在哪里。如果代码特定于主题,则应将其放入函数中。主题文件夹中的php。如果您要在多个主题上重复使用代码,那么维护一个包含所有共享代码的插件会更容易。

编辑:正如Stephen Harris在下面所指出的,由于WP 3.3,您也可以使用wp_enqueue_scripts 之后wp_head 已触发,例如在短代码或小部件中。然后将js加载到页脚中。

编辑2:对于jQuery和其他google托管库,建议您使用http://wordpress.org/extend/plugins/use-google-libraries/阅读奥托的激励评论。

SO网友:amit

您必须使用wp_enqueue_script 要加载主题的脚本,函数wp_register_script 仅使用关键字注册脚本。

wp_register_script( \'jqueryexample\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\');
这将简单地用名称注册新脚本jqueryexample 您可以在必要时使用wp_enqueue_script 作用

下面是要加载的已注册脚本示例代码,即jQuery和一个新的自己的脚本,即jQuery示例

<?php
function wpse_60056_load_scripts() {
    wp_enqueue_script( \'jquery\' );
    wp_register_script( \'jqueryexample\', \'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\');
    wp_enqueue_script( \'jqueryexample\' );

}    
add_action(\'wp_enqueue_scripts\', \'wpse_60056_load_scripts\');
?>
但是,您只能使用wp_enqueue_scripts 函数加载远程JavaScript,下面是一个示例-

wp_enqueue_script(\'jqueryexample\',\'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jqueryexample.min.js\'); 

结束