求助：JQuery.post无法向PHP文件传递变量的原因排查

我来帮你拆解下这个问题的核心，其实是你混淆了服务器端初始渲染和客户端AJAX异步请求的执行顺序：

• 当浏览器加载页面时，服务器会先跑完所有PHP代码：包括include 'listGen.php'; echo $viewwidth;这部分。此时客户端的JavaScript还没开始运行，更没有发送AJAX请求，所以$_POST['vwWid']根本不存在，$viewwidth就被设为默认值1200，这个值会直接输出到页面的div里，页面渲染完成后这个值就固定了。
• 你写的$.post确实把vwWid传给了listGen.php，但这个请求是异步的，而且你没有处理请求的返回结果，也没用来更新页面上已经显示的1200。

我们需要调整两个部分：让listGen.php返回处理后的宽度值，再通过AJAX回调更新页面内容。

1. 修改listGen.php #

让它直接输出最终的宽度值，方便AJAX接收响应：

<?php
if (isset($_POST['vwWid'])){
    $viewwidth = $_POST['vwWid'];
} else {
    $viewwidth = 1200;
}
// 直接输出值作为AJAX响应
echo $viewwidth;
?>

2. 调整前端AJAX代码 #

添加回调函数，接收服务器返回的值并更新页面：

<script type="text/javascript" src="../jquery.min.js"></script>
<script type="text/javascript">
function vwidth(){
    var vwWidth = window.innerWidth;
    document.getElementById('printVar').innerHTML = vwWidth; // 测试用的正常显示
    
    // 给$.post添加done回调，处理返回结果
    $.post( "listGen.php", {vwWid: vwWidth})
    .done(function(response) {
        // 更新显示PHP处理后结果的div
        document.getElementById('phpResult').innerHTML = response;
    });
}
</script>
<body onLoad="vwidth()" onResize="vwidth()">
<div id="printVar"></div>
<!-- 给这个div加id，方便JS定位更新 -->
<div id="phpResult"></div>
</body>

服务器端PHP代码是在页面发送给浏览器之前执行的，客户端JS则是页面加载到浏览器后才运行，这两个阶段完全独立——AJAX请求无法改变已经完成的初始PHP渲染结果，只能通过JS动态修改页面DOM。如果你的实际场景不需要PHP处理宽度值，其实直接用JS显示宽度就够了，不用绕PHP~

内容的提问来源于stack exchange，提问作者Cam Acc