javascript - 如何在提交表单时使用 wp_enqueue_script() 添加本地脚本？

Question

我正在创建一个 WordPress 插件，在插件设置页面上，用户可以在文本区域中添加一些内联脚本，然后单击“保存”

我想获取用户提交的脚本并在主题的页眉/页脚中排队

我已经尝试过这个 - 但当我单击管理页面上的“提交”而不是前端上的“提交”时，它会添加脚本

if(isset($_POST['submit']))
{
    // Enqueued script with localized data.
    wp_register_script( 'mapkitchenhandle', plugins_url( 'js/script.js', __FILE__ ) ); 

    wp_localize_script( 'mapkitchenhandle', 'trackcode', array('track' => $_POST['mapkitchentrackingcode']) );
    wp_enqueue_script( 'mapkitchenhandle');
}

任何人都可以帮我解决如何实现这一目标吗？

Answer 1

发布时，您应该将此数据保存到选项表中:

if (isset($_POST['submit']) && isset($_POST['mapkitchentrackingcode'])) {
    update_option('mapkitchentrackingcode', sanitize_text_field($_POST['mapkitchentrackingcode']));
}

我建议您在使用$_POST 变量之前对其进行清理。我没有打扰这里。

然后连接 wp_enqueue_scripts 操作并检查是否设置了 mapkitchentrackingcode 选项并使用 wp_localize_script() 添加它:

function wp_1231_enqueue_scripts()
{
    wp_register_script('mapkitchenhandle', plugins_url('js/script.js', __FILE__)); 

    if (false !== $trackingCode = get_option('mapkitchentrackingcode')) {
        wp_localize_script('mapkitchenhandle', 'trackcode', array('track' => $trackingCode));    
    }

    wp_enqueue_script('mapkitchenhandle');
}
add_action('wp_enqueue_scripts', 'wp_1231_enqueue_scripts');