来自Shortcode的wp_localize_script多次

时间:2018-03-15 11:48:33

标签: javascript wordpress shortcode

我有一个短代码 [提示] ,其中最后我正在做:

wp_enqueue_script( "tips", plugins_url( "/tips/js/tips.js", PATH ), array("jquery"), TIPS_VERSION, true );
wp_localize_script( "tips", "objTips", $objTips );

如果同一页面上有多个[提示]短代码,我希望传递一个objTips对象,其中包含该页面所有短代码中的$objTips数据。

现在它输出var objTips = {...}两次(或更多),因此JavaScript文件tips.js只能识别最后一个。我希望它像var objTips = [{...},{...},{...},...];

1 个答案:

答案 0 :(得分:1)

可以在短代码功能中使用静态计数器,如下所示:Count how many times shortcode is called and display different content in each « WordPress.org Forums

短代码声明会将提示添加到JS数组中:

add_shortcode( 'tips',  function ( $atts, $content = null, $shortcode ) {
    static $count = 0;

    # https://stackoverflow.com/questions/3737139/reference-what-does-this-symbol-mean-in-php
    $return = <<<JS
        <script> 
            objTips[$count] = "$content";
        </script>
JS;
    $count++;
    return $return;
});

add_action( 'wp_enqueue_scripts', function() {
    wp_enqueue_script(  'tips-script', plugin_dir_url( __FILE__ ) . '/tips.js', array( 'jquery' ) );
});

排队的JS文件将初始化该数组并显示文档加载的最终结果:

var objTips = [];

jQuery( document ).ready( function( $ ) { 
    console.log(objTips);
});

包含多个短代码的页面如下所示:

[tips]one[/tips]

[tips]two[/tips]

[tips]and three[/tips]

浏览器控制台上的结果: