javascript - 使用 Javascript 在选择框更改时显示 MySQL 列数据

Question

我有下面的代码，它使用 PHP While 循环显示一个 html 选择框，其中包含来自 MySQL 数据库的值

<select name="badge">
    <option value="">Please Choose...</option>
    <?php
    $sql2="SELECT * from badges order by name ASC ";
    $rs2=mysql_query($sql2,$conn) or die(mysql_error());
    while($result2=mysql_fetch_array($rs2))
    {
        echo '<option value="'.$result2["sequence"].'">'.$result2["name"].'</option>';
    }
    ?>
    </select>

在我的徽章表中我有以下列

1. 顺序
2. 姓名
3. 笔记

当选择框中的值发生变化时，我希望能够显示所选行的注释列

我目前有这个，但它没有使用 MySQL 表中的数据

<select id="select_test" name="form_select">
       <option value="0">No</option>
       <option value ="1">Yes</option>
    </select>

    <div id="div1" style="display: none;">hidden text</div>

<script>
        document.getElementById('select_test').addEventListener('change', function () {
            var style = this.value == 1 ? 'block' : 'none';
            document.getElementById('div1').style.display = style;
        });
</script>

如何使用 MySQL 完成上述操作？

这是普通 HTML 的样子:

http://jsfiddle.net/qHMJg/

Answer 1

很遗憾，您无法从浏览器访问 MySQL 服务器。我在我的示例中使用 jquery，您可以将其转换为原始 javascript(或者如果您不能，请在此处评论)，但我强烈建议您使用 jQuery。(因为我没有太多时间，所以我无法为您提供确切的代码JS，如果你需要，我明天会用它更新答案)

一旦满足元素的条件(如果你想要的话)，你可以使用 ajax (如果你不想使用 jquery，你可以使用原生的 ajax )来调用你的服务器。根据响应，您可以更新 div1 元素。

你可以查询另一个页面，专门写回答ajax。您可以将此代码用于 php 页面。如果您使用的是 POST，请将 $_GET 替换为 $_POST，或者将“sequence”替换为您为 ajax 调用指定的任何名称

$sql2="SELECT * from badges WHERE `sequence` = {$_GET['sequence']}";
$sql2=mysql_real_escape_string($sql2); // This is to prevent SQL injection should a hacker send bad data to your .php file
$rs2=mysql_query($sql2,$conn) or die(mysql_error());
$result2=mysql_fetch_array($rs2);
echo $result2["notes"];

Ps:我强烈推荐使用PDO for mysql。它更加方便和安全。

然后，一旦您收到 ajax 回复，只需用服务器回复您的内容替换 div 中的值