你是因为标题而来到这个问题的，你希望它会告诉你如何使用 jQuery 来检测对 html<select>下拉列表的更改，然后使用 AJAX 从 MySQL 数据库中获取值并返回答案。
这是一个有效的、经过测试的示例，可以帮助您入门。
首先，你需要三样东西：
1) 一个 MySQL 数据库，包含：
1a - 一个名为users
1b 的表 - 每行需要字段user_id, first_name, last_name
1c - 一堆数据，有两个或三个名字为Chris
1d 的用户 - 请注意，上述步骤中的大小写很重要（user_id不是User_ID）
1e - 在步骤 1b 中，您可以创建user_id一个自增字段，类型 = int
2) 一个名为“example.php”的 php 文件，其中包含：
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
//alert('Document is ready');
$('#stSelect').change(function() {
var sel_stud = $(this).val();
//alert('You picked: ' + sel_stud);
$.ajax({
type: "POST",
url: "example_ajax.php",
data: 'theOption=' + sel_stud,
success: function(whatigot) {
//alert('Server-side response: ' + whatigot);
$('#LaDIV').html(whatigot);
$('#theButton').click(function() {
alert('You clicked the button');
});
} //END success fn
}); //END $.ajax
}); //END dropdown change event
}); //END document.ready
</script>
</head>
<body>
<select name="students" id="stSelect">
<option value="">Please Select</option>
<option value="John">John Doe</option>
<option value="Mike">Mike Williams</option>
<option value="Chris">Chris Edwards</option>
</select>
<!-- **** The AJAX success fn will place found results into this DIV **** -->
<div id="LaDIV"></div>
</body>
3) 一个名为的 php 文件，example_ajax.php其中包含：
<?php
//Login to database (usually this is stored in a separate php file and included in each file where required)
$server = 'localhost'; //localhost is the usual name of the server if apache/Linux.
$login = 'abcd1234';
$pword = 'verySecret';
$dbname = 'abcd1234_mydb';
mysql_connect($server,$login,$pword) or die($connect_error); //or die(mysql_error());
mysql_select_db($dbname) or die($connect_error);
//Get value posted in by ajax
$selStudent = $_POST['theOption'];
//die('You sent: ' . $selStudent);
//Run DB query
$query = "SELECT `user_id`, `first_name`, `last_name` FROM `users` WHERE `first_name` = '$selStudent' AND `user_type` = 'staff'";
$result = mysql_query($query) or die('Fn test86.php ERROR: ' . mysql_error());
$num_rows_returned = mysql_num_rows($result);
//die('Query returned ' . $num_rows_returned . ' rows.');
//Prepare response html markup
$r = '
<h1>Found in Database:</h1>
<ul style="list-style-type:disc;">
';
//Parse mysql results and create response string. Response can be an html table, a full page, or just a few characters
if ($num_rows_returned > 0) {
while ($row = mysql_fetch_assoc($result)) {
$r = $r . '<li> ' . $row['first_name'] . ' ' . $row['last_name'] . ' -- UserID [' .$row['user_id']. ']</li>';
}
} else {
$r = '<p>No student by that name on staff</p>';
}
//Add this extra button for fun
$r = $r . '</ul><button id="theButton">Click Me</button>';
//The response echoed below will be inserted into the
echo $r;
笔记：
<head>a) 我在主文件中包含了 javascript 。通常，我们将 javascript 保存在一个单独的文件中（例如 mycode.js），并且只在主文件中引用它，因此：
<script type="text/javascript" src="mycode.js"></script>
b) 这条线非常重要。没有它，jQuery 不会，ajax 也不会。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>