wp_localize_script 用于插入图像答案

【问题标题】：wp_localize_script for inserting an imagewp_localize_script 用于插入图像
【发布时间】：2016-09-09 15:36:02
【问题描述】：

我在使用 wp_localize_script 时遇到了一些问题。已经有很多关于这个的问题，但我不知道如何将它们实施到这个特定的案例中。我制作了一个 jQuery 文件，该文件在每个具有特定类的 div 之后包含一个图像。 jQuery 本身很好，因为我可以使用段落标签更改图像标签，然后它会显示在我的浏览器中。这是我在functions.php中的内容

function wpa_scripts() {
wp_enqueue_script(
    'divider',
    get_template_directory_uri() . '/js/divider.js',
    array('jquery'),
    null,
    true
);
$script_data = array(
    'image_path' => get_template_directory_uri() . '/images/'
);
wp_localize_script(
    'divider',
    'divider_data',
    $script_data
); } add_action( 'wp_enqueue_scripts', 'wpa_scripts' );

这就是我的 .js 中的内容

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

$('.contentpage').after('<img src=" '$script_data' + divider_placeholder.png">');   });

谁能告诉我我做错了什么？提前致谢。

亲切的问候，史蒂夫

【问题讨论】：

标签： php jquery wordpress image

【解决方案1】：

您需要在 jQuery 函数中使用 'divider_data.image_path' 而不是 $script_data：

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

    $('.contentpage').after('<img src="' + divider_data.image_path + 'divider_placeholder.png">');

});

参考：https://codex.wordpress.org/Function_Reference/wp_localize_script

【讨论】：

谢谢！我对 Wordpress 很陌生，所以我的代码可能与我在互联网上找到的答案相去甚远。两个答案都是正确的:)

【解决方案2】：

您的变量 $script_data 在 js 文件中的语法不正确，并且您没有访问预定义的本地化变量 divider_data：

代替：
$('.contentpage').after('<img src=" '$script_data' + divider_placeholder.png">'); });

应该是：

$('.contentpage').after('<img src="' + divider_data.image_path + 'divider_placeholder.png">');   });

【讨论】：