如何通过AJAX实现点击按钮不跳转打印指定页面内容

你可以通过隐藏iframe加载Print.php的内容，全程不会弹出新窗口也不会跳转页面，即可完成打印操作。

修改后的代码如下：

// Update bill status and print
$(document).on('click', '.update_status', function(e){
    e.preventDefault();
    var ordernum=$(this).data("id");
    $.ajax({  
        url:"pages/UpdateBillStatus.php",  
        method:"POST",  
        data:{ordernum:ordernum},
        success:function(data){
            document.getElementById('status'+ordernum).innerHTML = data;

            // 替换原有window.open逻辑，用隐藏iframe实现无跳转打印
            // 创建隐藏iframe
            const printIframe = document.createElement('iframe');
            printIframe.style.position = 'absolute';
            printIframe.style.width = '0';
            printIframe.style.height = '0';
            printIframe.style.border = 'none';
            printIframe.style.left = '-9999px';
            printIframe.style.top = '-9999px';
            // 设置打印页地址
            printIframe.src = 'http://localhost/LaLigaCafe/pages/Print.php?ordernum='+ordernum;
            // 等待iframe加载完成后触发打印
            printIframe.onload = function() {
                printIframe.contentWindow.print();
                // 打印完成后移除iframe，避免冗余DOM
                setTimeout(() => {
                    document.body.removeChild(printIframe);
                }, 100);
            };
            // 把iframe插入当前页面
            document.body.appendChild(printIframe);
        }
    }); 
});

注意事项 #

• 该方案依赖同域策略，你当前本地环境下Print.php和当前页面属于同域名，不会出现跨域问题
• Print.php的打印样式会直接生效，你可以在该页面内单独配置打印专用的CSS规则，不需要修改当前Receipts页面的样式

内容的提问来源于stack exchange，提问作者Hazem El-behairy