问题描述

我需要在 javascript 文件中包含我的主题文件的路径。我该怎么办？我已经尝试过：

var templateUrl = "<?php get_stylesheet_directory_uri(); ?>";

function LightboxOptions() {
  this.fileLoadingImage = "'"+templateUrl+"/img/loading.gif'";
  this.fileCloseImage = "'"+templateUrl+"/img/close.png'";
  this.resizeDuration = 700;
  this.fadeDuration = 500;
  this.labelImage = "Image";
  this.labelOf = "of";
}

这不给我的路径，只是插入<?php get_stylesheet_directory_uri(); ?> 而不是实际的路径。有任何想法吗？提前致谢！

最佳解决方案

你要找的是 wp_localize_script function 。

当使用脚本时，您可以使用它

wp_register_script( 'my-script', 'myscript_url' );
wp_enqueue_script( 'my-script' );
$translation_array = array( 'templateUrl' => get_stylesheet_directory_uri() );
//after wp_enqueue_script
wp_localize_script( 'my-script', 'object_name', $translation_array );

在你的 style.js 中，会有：

var templateUrl = object_name.templateUrl;
...

次佳解决方案

以下是在 javascript 文件中添加主题路径的两种方法。

1) 您可以使用您的 functions.php 文件中由 wordpress 建议的 wp_localize_script()。这将在标题中创建一个 JavaScript 对象，这将在运行时可用于您的脚本。

示例：

wp_register_script('custom-js',get_stylesheet_directory_uri().'/js/custom.js',array(),NULL,true);
wp_enqueue_script('custom-js');

$wnm_custom = array( 'stylesheet_directory_uri' => get_stylesheet_directory_uri() );
wp_localize_script( 'custom-js', 'directory_uri', $wnm_custom );

并可以在您的 js 文件中使用如下：

alert(directory_uri.stylesheet_directory_uri);

2) 您可以创建一个将模板目录 uri 保存在变量中的 JavaScript 代码片段，并在以后使用如下：将此代码添加到 header.php 文件中，然后再使用此路径。例：

<script type="text/javascript">
var stylesheet_directory_uri = "<?php get_stylesheet_directory_uri(); ?>";
</script>

并可以在您的 js 文件中使用如下：

alert(stylesheet_directory_uri);

参考文献

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。