php在js-file Wordpress中

Question

在.js文件中,我需要获取Wordpress主题的模板目录,即我需要获取<?php bloginfo('template_directory');?>js文件中的返回值 .

这个想法是这样的:

var blogTemplateDir = "<?php bloginfo('template_directory');?>";

怎么能实现这一目标？这样做的标准(Wordpress)方式是什么？

Answer 1

Wordpress提供了一个wp_localize_script()函数,允许您在使用Wordpress注册PHP数组时将其传递给.js文件.

它的工作原理如下

1)使用wp_register_script()在Wordpress中注册脚本; 构建要发送到脚本的参数数组.

wp_enqueue_script('my-script','/path/to/script.js');

2)构建要发送到脚本的参数数组.

$params = array('foo' => 'bar','setting' => 123);

3)调用wp_localize_script()并为您的参数指定唯一名称.

wp_localize_script( 'my-script', 'MyScriptParams', $params );

4)您可以在JavaScript中访问变量,如下所示:

<script>
alert(object_name.some_string);
</script>

注意:如果希望Wordpress在头文件中包含JavaScript文件,则需要使用wp_enqueue_script().

把它们拉在一起

<?php
$myPlugin = new MyPlugin();

//Add some JS to the admin section
add_action('admin_enqueue_scripts', array($myPlugin, 'adminJavaScript'));

class MyPlugin{

        public function adminJavaScript() {

        $settings = array(
            'foo' => 'bar',
            'setting' => 123
        );

        wp_register_script('myJavaScriptName', plugins_url('/myJavaScript.min.js', __FILE__));
        wp_localize_script('myJavaScriptName', 'settings', $settings); //pass any php settings to javascript
        wp_enqueue_script('myJavaScriptName'); //load the JavaScript file
    }
}
?>

<script>
    alert(settings.foo);
</script>

Answer 2

正如 Erik 之前发布的那样，JavaScript 文件的文件扩展名毫无意义，因为它最终取决于内容。在开发过程中遇到这种情况时，我发现我需要将以下内容添加到所谓的 JavaScript 文件的顶部：

<?php

   //Let's set the header straight
   header('Content-type: text/javascript');

   //Get the WP-specifics, so that we can use constants and what not
   $home_dir = preg_replace('^wp-content/plugins/[a-z0-9\-/]+^', '', getcwd());
   include($home_dir . 'wp-load.php');
?>

这可以确保您将定义放入 JavaScript 文件中，并且您也可以将上面的示例与主题一起使用（只需确保将其更改/plugins为/themes即可）。