子比主题前台管理员快速切换账号-zibll教程分享社区-zibll子比主题-WordPress主题模板-zibll子比主题

子比主题前台管理员快速切换账号

该帖子部分内容已隐藏
付费阅读
已售 2
30
此内容为付费阅读,请付费后查看

如题,制作了一个子比主题前台快速切换账号的功能,仅4个函数,1个JavaScript实现

20250214022733995-QQ_1739471249748

20250214022751987-QQ_1739471269607

快捷键为Ctrl+Q,非管理员无法唤出弹窗

PHP

JavaScript

jQuery(document).ready(function($) {
    // 监听全局的键盘按下事件
    $(document).keydown(function(event) {
        // 检查是否按下了CTRL和Q键
        if (event.ctrlKey && event.key === "q") {
            event.preventDefault(); // 防止浏览器默认行为
            
            // 触发模态框显示逻辑
            openManageLoginModal();
        }
    });

    // 也可以通过点击按钮来打开模态框
    $('#open-modal-btn').click(openManageLoginModal);

    function openManageLoginModal() {
        var modalId = 'manage-login-modal';
        var modalContentId = 'manage-login-modal-content';

        // 检查模态框是否已经存在
        if ($('#' + modalId).length === 0) {
            // 创建新的模态框结构
            var modalHtml = `
                <div class="modal fade" id="${modalId}" tabindex="-1" role="dialog">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div id="${modalContentId}" class="modal-body">
                                <!-- 内容将通过AJAX加载 -->
                                <p class="placeholder t1"></p>
                                <h4 style="height:120px;" class="placeholder k1"></h4>
                                <p class="placeholder k2"></p>
                                <i class="placeholder s1"></i>
                                <i class="placeholder s1 ml10"></i>
                            </div>
                        </div>
                    </div>
                </div>
            `;
            $('body').append(modalHtml);
        }

        // 加载远程内容
        $.ajax({
            url: window._win.ajax_url, // 使用已定义的ajax_url
            method: 'POST',
            data: {
                action: 'manage_login_modal', // PHP钩子中的action名称
                // 如果有其他数据需要传递给服务器端,可以在这里添加
            },
            success: function(response) {
                // 将响应内容插入到模态框容器中
                $('#' + modalContentId).html(response);
                // 显示模态框
                $('#' + modalId).modal('show');
            },
            error: function(error) {
                console.error('Error loading modal content:', error);
            }
        });
    }
});

 

请登录后发表评论