如何在插件中将Java脚本入队

时间：2016-02-06 作者：The WP Intermediate

这次我在插件文件夹中包含JavaScript文件方面做了很多工作。

我试图通过从主题目录传输小部件文件来创建插件。我复制了小部件文件，但该小部件文件依赖于JavaScript文件，所以我在插件目录中创建了一个/js/文件夹。此文件托管在“jquery.repeatable.js”中

我使用了这段代码，但它似乎没有包含js文件-

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( \'my_custom_script\', plugin_dir_url( __FILE__ ) . \'js/jquery.repeatable.js\' );
}
add_action(\'admin_enqueue_scripts\', \'Zumper_widget_enqueue_script\');
我在论坛上搜索了这个-https://stackoverflow.com/questions/31489615/call-a-js-file-from-a-plugin-directory

但这仍然没有帮助。

我在重新总结我的问题。在我的插件目录中，此文件夹下有一个js文件-/js/

我希望包括它什么是正确的过程，我还需要注册什么吗？

这部分有什么问题吗-\'admin_enqueue_scripts\'?

3 个回复
最合适的回答,由SO网友:cybmeta 整理而成

您的代码似乎正确，但它将只在管理区域加载脚本，因为您正在将脚本排队admin_enqueue_scripts action.

要在前端加载脚本，请使用wp_enqueue_scripts 动作（与wp_enqueue_script() function):

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( \'my_custom_script\', plugin_dir_url( __FILE__ ) . \'js/jquery.repeatable.js\' );
}
add_action(\'wp_enqueue_scripts\', \'Zumper_widget_enqueue_script\');
此外，该脚本似乎依赖于jQuery，因此您应该声明dependencie或脚本可以在jQuery之前加载，并且它不会工作。此外，我强烈建议声明scripot的版本。这样，如果您将脚本更新为新版本，浏览器将再次加载它，并丢弃缓存中的副本。

例如，如果脚本的版本为1.0：

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( \'my_custom_script\', plugin_dir_url( __FILE__ ) . \'js/jquery.repeatable.js\', array(\'jquery\'), \'1.0\' );
}
add_action(\'wp_enqueue_scripts\', \'Zumper_widget_enqueue_script\');
如果要将其加载到管理区域：

function Zumper_widget_enqueue_script() {   
    wp_enqueue_script( \'my_custom_script\', plugin_dir_url( __FILE__ ) . \'js/jquery.repeatable.js\', array(\'jquery\'), \'1.0\' );
}
add_action(\'admin_enqueue_scripts\', \'Zumper_widget_enqueue_script\');

SO网友:Zaheer Abbas

我通常使用plugins_url() 方法实现排队。

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( \'my_custom_script\', plugins_url(\'js/jquery.repeatable.js\', __FILE__ ), \'1.0.0\', false );
}
add_action(\'admin_enqueue_scripts\', \'Zumper_widget_enqueue_script\');

SO网友:mukto90

UPDATED:

改用此代码

function Zumper_widget_enqueue_script()
{   
    wp_enqueue_script( \'my_custom_script\', plugin_dir_url( __FILE__ ) . \'js/jquery.repeatable.js\', array(\'jquery\'), \'1.0.0\', false );
}
add_action(\'admin_enqueue_scripts\', \'Zumper_widget_enqueue_script\');
第三个参数是声明依赖关系，第四个参数是定义版本。

设置的第5个参数wp_enqueue_script() 到true. 这意味着，此文件将加载到页脚中。

标签： plugin-development   wp-enqueue-script   小码农  

相关推荐