如何将自定义 javascript 添加到 WordPress 管理员？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3326967/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add custom javascript to WordPress Admin?
提问by Nacho
I want to add some custom jquery code to the Edit Post page, something really simple like showing a div when someone presses Publish.
我想向“编辑帖子”页面添加一些自定义 jquery 代码，这非常简单，例如在有人按下发布时显示一个 div。
The only restriction is that I want to achieve this through the use of a plugin, not hacking the admin template files.
唯一的限制是我想通过使用插件来实现这一点，而不是破解管理模板文件。
I've tried echoing some script tags using some actions but it doesn't seem to be the way.
我试过使用一些动作来回显一些脚本标签，但似乎不是这样。
回答by Tim
Use the admin_enqueue_scriptsaction and the wp_enqueue_scriptmethod to add custom scripts to the admin interface.
使用admin_enqueue_scripts操作和wp_enqueue_script方法将自定义脚本添加到管理界面。
This assumes that you have myscript.jsin your plugin folder. Change accordingly. The my_custom_scripthandle should be unique for your module and script.
这假设myscript.js您的插件文件夹中有。相应地改变。该my_custom_script手柄应该是你的模块和脚本是唯一的。
function my_enqueue($hook) {
// Only add to the edit.php admin page.
// See WP docs.
if ('edit.php' !== $hook) {
return;
}
wp_enqueue_script('my_custom_script', plugin_dir_url(__FILE__) . '/myscript.js');
}
add_action('admin_enqueue_scripts', 'my_enqueue');
回答by Fedir RYKHTIK
There is a snippet for Your functions.php file :
你的functions.php文件有一个片段：
function custom_admin_js() {
$url = get_bloginfo('template_directory') . '/js/wp-admin.js';
echo '"<script type="text/javascript" src="'. $url . '"></script>"';
}
add_action('admin_footer', 'custom_admin_js');
Works fine on Wordpress 3.2.1.
在 Wordpress 3.2.1 上运行良好。
回答by Sean Fisher
<?php
function add_jquery_data() {
global $parent_file;
if ( isset( $_GET['action'] ) && $_GET['action'] == 'edit' && isset( $_GET['post'] ) && $parent_file == 'edit.php') {
// Do some stuff.
}
}
add_filter('admin_head', 'add_jquery_data');
?>
回答by Shaun Cockerill
admin_enqueue_scriptsand wp_enqueue_scriptare the preferred way to add javascript files to the dashboard.
admin_enqueue_scripts并且wp_enqueue_script是将 javascript 文件添加到仪表板的首选方式。
// I'm using an anonymous function for brevity.
add_action( 'admin_enqueue_scripts', function() {
wp_enqueue_script( 'handle', plugin_dir_url( __FILE__ ) . '/script.js' );
} );
If you want to output the javascript using your PHP function however, wp_add_inline_scriptdoesn't seem to work. Instead, you can use admin_print_scriptsto directly echo out the script, including the script tags themselves. Just ensure to set the priority high so that it loads after any required libraries, such as jQuery.
但是，如果您想使用 PHP 函数输出 javascript，wp_add_inline_script则似乎不起作用。相反，您可以使用admin_print_scripts直接回显脚本，包括脚本标签本身。只需确保将优先级设置为高，以便在任何必需的库之后加载，例如jQuery.
add_action( 'admin_print_scripts', function() {
// I'm using NOWDOC notation to allow line breaks and unescaped quotation marks.
echo <<<'EOT'
<script type="text/javascript">
jQuery(function($){
// Do stuff here.
});
</script>
EOT;
}, PHP_INT_MAX );
回答by squarecandy
If you want to get fancy and filter where you want to load the file or not, best to use get_current_screen.
如果您想花哨并过滤要加载文件的位置，最好使用get_current_screen.
function myproject_admin_enqueue() {
$screen = get_current_screen();
// load on the NEW and EDIT screens of all post types
if ( 'post' === $screen->base ) {
wp_enqueue_script('my_custom_script', plugin_dir_url( __FILE__ ) . 'all-admin.js');
}
// load on the NEW and EDIT screens of one post type
if ( 'post' === $screen->base && 'myposttype' === $screen->post_type ) {
wp_enqueue_script('my_custom_script', plugin_dir_url( __FILE__ ) . 'mypostype-admin.js');
}
// load only when adding a NEW post, not when editing an existing one.
if ( 'post' === $screen->base && 'add' === $screen->action ) {
wp_enqueue_script('my_custom_script', plugin_dir_url( __FILE__ ) . 'new-admin.js');
}
}
add_action('admin_enqueue_scripts', 'myproject_admin_enqueue');
回答by tosturaw
Directly adding wp_enqueue_scriptto your code doesn't include the script in new versions of Wordpress (5.0 above). The better way is to register the script with wp_register_scriptfirst to create a handle and then enqueue that handle.
直接将wp_enqueue_script添加到您的代码中不会在 Wordpress 的新版本（5.0 以上）中包含该脚本。更好的方法是首先使用wp_register_script注册脚本以创建一个句柄，然后将该句柄入队。
function custom_script_in_admin($hook) {
if ('edit.php' !== $hook) {
return;
}
wp_register_script( 'custom_handle_name',plugin_dir_url( __FILE__ ) . '/script.js', '',true );
wp_enqueue_script('custom_handle_name');
}
add_action('admin_enqueue_scripts', 'custom_script_in_admin');
