js文件Wordpress中的php

Posted 2023-02-24

【中文标题】js文件Wordpress中的php

【英文标题】：php within js-file Wordpress

【发布时间】：2011-10-12 02:25:35

【问题描述】：

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

这个想法是这样的：

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

如何做到这一点？这样做的标准（Wordpress）方式是什么？

【参考方案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>

【讨论】：

优秀的答案。我使用 Wordpress 已经 5 年了，我不知道 wp_localize_script()。我刚刚在我当前的项目中使用了这种技术，它完美地工作。在我看来，这显然是最正确的方法。谢谢！

【参考方案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）。

【讨论】：

谢谢，我在想如果我在 header.php 中做 <script type="text/javascript"> var templateDir = "<?php bloginfo('template_directory') ?>"; </script>，为什么我不能在我的 .js 文件中访问 templateDir 的值。有没有办法让它工作，因为我可以保留我的 js 文件？

好吧，你是在加载其他 JavaScript 文件之前设置templateDir 吗？如果是这样，应该可以使用 js 文件中的变量。 File 1 (index.php): http://pastebin.com/sQGnmM9SFile 2 (javascript.js): http://pastebin.com/cnUv5inD

谢谢您，我之前的订单有误。现在它起作用了！ :)

感谢您确定如何在 JS 中导入所有变量。注意：对于在主题中执行此操作的其他人，请在上面的代码中将 /plugins/ 替换为 /themes/

【参考方案3】：

将 .js 包装在一个 .php 文件中，然后将其包含在您的上下文中。

【参考方案4】：

javascript 文件的文件扩展名没有意义。您可以像处理 html 页面一样使用 PHP 来输出您的 javascript 文件。将 JS 文件包含为：

<script src="my_javascript_file.php"></script>

然后你可以在你的javascript文件中使用你问题中的那一行：

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

【讨论】：

使用<script src="my_javascript_file.php"></script> 会导致其他文件出现奇怪的错误。不要问我，它只会杀死我的页面。如果我改为使用<?php require "my_javascript_file.php" ?>，那么它可以工作。另外，如果我遵循这个解决方案，我必须将我的所有 js 代码包装到我的（前）js 文件中的<script type="text/javascript"><script> 中。它确实以这种方式工作，但是由于我一直在寻找一个允许我保留我的 js 文件的解决方案，所以我决定将 Ninetwozero 的答案标记为正确答案。