You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

多个相同下拉选择框复用同一AJAX查询数据库的实现咨询

解决方案

你完全不需要重复编写多份相同逻辑,只需要修正现有代码的两处核心错误,就能实现所有下拉框共用同一套查询逻辑:

  1. 原JS代码的事件绑定语法错误,on方法的括号闭合位置不对
  2. AJAX成功回调里的this指向发生了变化,不再指向触发事件的下拉框

修改后的代码

1. js/ajax.js 修正版

// 直接用类选择器.player绑定所有下拉框的change事件
$(".player").on("change", function() {
    // 先把当前触发事件的下拉框存为变量,避免回调里this指向偏移
    const $currentSelect = $(this);
    const selectedName = $currentSelect.val();
    
    $.ajax({
        url: "../showvalue.php",
        method: "POST",
        data: { id: selectedName },
        success: function(data) {
            // 用提前存好的当前下拉框变量找对应的value展示单元格
            $currentSelect.closest("td").next(".value").html(data);
        }
    });  
});

2. selectplayer.php 优化版(可选,避免重复写HTML和查询逻辑)

你可以用循环直接输出多个下拉框,不用手动复制10次代码:

<?php
// 先统一查一次玩家列表,不用每次下拉框都查一次
$sql = "SELECT * FROM players ORDER BY value DESC";
$result = mysqli_query($conn, $sql);
$players = [];
if (mysqli_num_rows($result) > 0) {
    while ($row = mysqli_fetch_assoc($result)) {
        $players[] = $row;
    }
}

// 循环输出10个玩家选择行
for ($i = 1; $i <= 10; $i++) {
?>
<tr>
    <td style="width:50%;">
        <select name="player<?php echo $i; ?>" class="player">
            <option disabled selected value></option>
            <?php foreach ($players as $p) { ?>
                <option value="<?php echo htmlspecialchars($p['playername']); ?>">
                    <?php echo htmlspecialchars($p['playername']); ?>
                </option>
            <?php } ?>
        </select>
    </td>
    <td style="width:50%;" class="value"></td>
</tr>
<?php } ?>

3. showvalue.php 安全优化版(修复SQL注入风险)

<?php
// ...数据库连接代码...
$pl = trim($_POST['id'] ?? '');
if (!empty($pl)) {
    // 使用预处理语句避免SQL注入
    $stmt = mysqli_prepare($conn, "SELECT value FROM players WHERE playername = ?");
    mysqli_stmt_bind_param($stmt, "s", $pl);
    mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt);
    if ($row = mysqli_fetch_assoc($result)) {
        echo htmlspecialchars($row['value']);
    }
    mysqli_stmt_close($stmt);
}
?>

内容的提问来源于stack exchange,提问作者Matt Drake

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.07 01:45:03