如何为特定用户角色隐藏页面指定div？代码无效求解决方案

云上老周

2026-8-5

解决建议

问题分析

你当前的代码存在几个关键问题：

直接在functions.php中输出脚本不符合WordPress规范，应该通过官方钩子注入脚本
仅用empty()只是清空div内容，并非真正隐藏元素，视觉效果可能不符合预期
未限定生效页面范围，脚本会在全站所有页面执行
WordPress默认启用jQuery的noConflict模式，直接使用$可能导致JS报错

修正方案

方案1：通过WordPress钩子注入脚本（推荐）

将以下代码替换原有代码，放到主题的functions.php中：

add_action('wp_footer', 'hide_div_for_shop_manager');
function hide_div_for_shop_manager() {
    // 仅在目标页面执行，替换成你的页面slug/ID/模板标识
    if (!is_page('your-target-page-slug')) return;

    $user = wp_get_current_user();
    if (in_array('shop_manager', $user->roles)) {
        ?>
        <script>
        jQuery(document).ready(function($){
            // 可选操作：hide()隐藏元素 / remove()直接移除 / empty()清空内容
            $('#hide').hide();
        });
        </script>
        <?php
    }
}

把your-target-page-slug替换成目标页面的slug（URL最后一段），或者用is_page(123)（123为页面ID）指定页面
根据需求选择对应的DOM操作：hide()仅隐藏元素、remove()直接删除元素、empty()清空内容保留结构

方案2：直接在目标页面模板中添加代码

如果不想修改functions.php，可以打开目标页面的模板文件（比如page-your-slug.php），在wp_footer()函数之前添加以下代码：

<?php
$user = wp_get_current_user();
if (in_array('shop_manager', $user->roles)) {
?>
<script>
jQuery(document).ready(function($){
    $('#hide').hide();
});
</script>
<?php } ?>