从JS弹窗传变量至父窗口供PHP MySQL查询时的$_GET/$_POST问题

目标流程 #

• 点击父窗口的「添加」按钮，弹出显示可选项目列表的子窗口
• 用户点击列表某一行，提交该项目的索引/ID
• 子窗口关闭，将项目ID传回父窗口
• 父窗口使用该ID通过PHP查询MySQL数据，并添加新行

遇到的问题 #

子窗口尝试通过表单提交传递itemID，但父窗口中isset($_GET['itemID'])始终返回false，预设的$full_id一直是1。核心原因是PHP是服务端语言，页面加载时就已执行完毕，父窗口中的PHP代码在页面首次加载时就运行了，后续子窗口触发JS函数时，PHP代码不会重新执行，自然拿不到新传递的参数。

代码问题分析 #

1. 子窗口表单用GET方法提交后会跳转到/combine-quote.php，但父窗口并未刷新，导致父窗口PHP无法获取参数
2. 父窗口试图在JS函数嵌套PHP代码，逻辑错误——PHP在服务端先执行，JS在客户端后执行，两者无法实时交互

正确实现方案 #

1. 修改子窗口代码：直接传递ID给父窗口并关闭 #

子窗口无需表单提交，直接把选中的ID传给父窗口的JS函数，然后关闭窗口：

// 假设str是选中的项目ID
var str = "选中的ID值";
// 调用父窗口的接收函数传递ID
window.opener.receiveItemId(str);
// 关闭子窗口
window.close();

2. 父窗口代码：通过AJAX调用PHP接口查询数据 #

父窗口定义接收ID的函数，用AJAX把ID传给PHP接口，获取查询结果后更新页面：

<script>
window.receiveItemId = function(itemId) {
    // 创建AJAX请求
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/get-item-data.php?itemID=' + itemId, true);
    xhr.onload = function() {
        if (xhr.status === 200) {
            // 解析返回的JSON数据
            var itemData = JSON.parse(xhr.responseText);
            // 处理数据，示例：弹出查询到的ID
            alert('查询到的项目ID：' + itemData.id);
            // 示例：将数据添加到页面新行
            var table = document.getElementById('target-table');
            var newRow = table.insertRow();
            var cell = newRow.insertCell(0);
            cell.textContent = itemData.name;
            // 可添加更多单元格处理逻辑
        }
    };
    xhr.send();
};
</script>

3. 新建PHP接口文件get-item-data.php #

负责接收itemID，查询MySQL并返回JSON格式数据：

<?php
// 连接MySQL（替换为你的数据库信息）
$conn = mysqli_connect('localhost', '用户名', '密码', '数据库名');
if (!$conn) {
    die('数据库连接失败：' . mysqli_connect_error());
}

$itemId = isset($_GET['itemID']) ? $_GET['itemID'] : '';
$result = [];
if ($itemId) {
    // 使用预处理语句防止SQL注入
    $stmt = mysqli_prepare($conn, "SELECT * FROM 目标表名 WHERE id = ?");
    mysqli_stmt_bind_param($stmt, 's', $itemId);
    mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt)->fetch_assoc();
}

// 返回JSON数据
header('Content-Type: application/json');
echo json_encode($result);

// 关闭数据库连接
mysqli_close($conn);
?>

关键说明 #

• 子窗口通过window.opener直接调用父窗口函数，避免表单跳转导致的页面刷新问题
• 用AJAX实现客户端与服务端的异步通信，实时获取数据库数据
• 使用PHP预处理语句防范SQL注入，保证代码安全性

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