将高级自定义字段添加到 javascript

Question

我在管理员中创建了一个 ACF 选项，因此用户可以通过管理员添加 cookie 通知文本...我正在使用的 javascript 脚本在 javascript 中创建消息，所以我想在 javascript.

中回显 ACF 字段

在我的 cookie.js 文件的顶部，我有："<?php $cooke_msg = the_field('cookie_notice', 'option'); ?>"; 并且我在一个 var 中回应它，如下所示：var msg = "<?php echo $cookie_msg; ?>"; 所以我的文件的顶部看起来像这样:

"<?php $cooke_msg = the_field('cookie_notice', 'option'); ?>";

(function(){

  //Change these values
  var msg = "<?php echo $cookie_msg; ?>";
  var closeBtnMsg = "OK";
  var privacyBtnMsg = "Privacy Policy";
  var privacyLink = "https://www.google.com";

  //check cookies 
  if(document.cookie){
   var cookieString = document.cookie;
   var cookieList = cookieString.split(";");
   // if cookie named OKCookie is found, return
   for(x = 0; x < cookieList.length; x++){
     if (cookieList[x].indexOf("OKCookie") != -1){return}; 
   }
  }

我在查看网站时得到的是：<?php echo $cookie_msg; ?> 而不是来自 ACF 的实际消息...有没有办法实际执行此操作？

Answer 1

Wordpress 提供了很好的功能，可以将 PHP 变量数据传递给 js 文件。

将此代码放入您的主题 functions.php 页面。

function mytheme_load_scripts() {

    wp_enqueue_script('mytheme-script', get_template_directory_uri() . '/js/mytheme-script.js');
    wp_localize_script('mytheme-script', 'mytheme_script_vars', array(
        'alert' => get_field("cookie_notice",$post_id)
        )
    );

 }
 add_action('wp_enqueue_scripts', 'mytheme_load_scripts');

并在主题根目录下创建一个js文件夹。在该目录中创建名为 mytheme-script.js 文件的 js 文件，并将以下代码放在那里。

jQuery(document).ready(function($) {

 alert( mytheme_script_vars.alert );

});

现在访问您网站的任何页面。当然，您会收到有关您的期望字段值的警报。确保您将正确的值分配给 $post_id。我想这会对你有所帮助。法典参考 link 了解更多详情：WP Localize Script Function

将高级自定义字段添加到 javascript

adding Advanced Custom Field to javascript

javascript

php

wordpress

jquery

advanced-custom-fields