我可以在添加内联脚本的同时添加自定义属性吗？

时间：2016-07-19 作者：dan9vu

我需要在不修改核心的情况下将一些下划线模板注入管理屏幕。模板如下所示：

<script type="text/template" id="template-123">
    <div class="section intro">
        {{{ data.section.intro }}}
    </div>

    <div class="section content">
        {{{ data.section.content }}}
    </div>
    ...
</script>
所有模板都依赖于特定的脚本句柄，所以我考虑使用wp_add_inline_script() 但它不允许我具体说明type 和id 属性

那么，在添加内联脚本的同时，是否有一种黑客解决方案来添加该属性？还是有更好的方法？

我真的很感谢你的帮助！

1 个回复
最合适的回答,由SO网友:birgire 整理而成

这里有一个演示建议：

add_action( \'admin_enqueue_scripts\', function()
{
   wp_enqueue_script(    \'my-script\', \'/my-script.js\', [\'underscore\', \'backbone\'], \'1.0\' );
   wp_add_inline_script( \'my-script\', \'alert("hello world");\' );

   // Add our template
   if( function_exists( \'wpse_add_inline_tmpl\' ) )
       wpse_add_inline_tmpl( 
           $handle = \'my-script\', 
           $id     = \'my-tmpl\', 
           $tmpl   = \'<div class="section intro">{{{ data.section.intro }}}</div>\' 
       );

} );
我们定义我们的客户wpse_add_inline_tmpl() 功能如下：

function wpse_add_inline_tmpl( $handle, $id, $tmpl )
{
    // Collect input data
    static $data = [];
    $data[$handle][$id] = $tmpl;

    // Append template for relevant script handle
    add_filter( 
        \'script_loader_tag\', 
        function( $tag, $hndl, $src ) use ( &$data, $handle, $id )
        {   
            // Nothing to do if no match
            if( ! isset( $data[$hndl][$id] ) )
                return $tag;

            // Script tag replacement aka wp_add_inline_script()
            if ( false !== stripos( $data[$hndl][$id], \'</script>\' ) )
                $data[$hndl][$id] = trim( preg_replace( 
                    \'#<script[^>]*>(.*)</script>#is\', 
                    \'$1\', 
                     $data[$hndl][$id] 
                ) );

            // Append template
            $tag .= sprintf(
                "<script type=\'text/template\' id=\'%s\'>\\n%s\\n</script>" . PHP_EOL,
                esc_attr( $id ),
                $data[$hndl][$id]
            );

            return $tag;
        }, 
   10, 3 );
}
这里我们使用script_loader_tag 筛选以插入模板代码，并使用句柄和id引用它。我们还使用脚本标记replacement 从核心wp_add_inline_script() 作用

希望您可以对此进行进一步测试，并根据您的需要进行修改。将其作为类编写可能是更好的方法；-）

标签： wp-admin   javascript   underscore   小码农  

相关推荐

对用户wp-admin中的新列进行排序

我在用户管理选项卡中创建了一个新列，名为；列表；。每一行都是一个数字，表示用户有多少个列表。//// ADD THE NEW COLUMN add_filter( \'manage_users_columns\', \'add_listing_count_column\' ); function add_listing_count_column( $columns ) { $columns[\'Listings\'] = \'Listings\'; //