在eclipse用ajax获取下拉框选中选项查询数据库的代码
时间: 2023-03-23 22:03:28 浏览: 128
下拉框用户选择方式数据库查询网页源代码.rar
好的,以下是使用 Ajax 在 Eclipse 中获取下拉框选项查询数据库的示例代码:
HTML 页面:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>下拉框选项</title>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#city").change(function() {
var city = $("#city").val();
$.ajax({
url: "getOptions.php",
type: "POST",
data: {city : city},
dataType: "json",
success: function(data) {
$("#option").empty();
$.each(data, function(key, value) {
$("#option").append($("<option></option>")
.attr("value", key)
.text(value));
});
}
});
});
});
</script>
</head>
<body>
<select id="city">
<option value="0">请选择城市</option>
<option value="1">北京</option>
<option value="2">上海</option>
<option value="3">广州</option>
<option value="4">深圳</option>
</select>
<select id="option"></select>
</body>
</html>
```
PHP 文件 getOptions.php:
```php
<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
$city = $_POST["city"];
$sql = "SELECT id, option_name FROM options WHERE city = '$city'";
$result = $conn->query($sql);
$options = array();
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$options[$row["id"]] = $row["option_name"];
}
}
echo json_encode($options);
$conn->close();
?>
```
在这个示例中,当用户在下拉框中选择城市时,使用 Ajax 向服务器发送一个 POST 请求,请求的数据为选中的城市值。服务器收到请求后,从数据库中查询该城市下的选项,并将结果以 JSON 格式返回给客户端。客户端收到服务器返回的数据后,使用 jQuery 的 each() 方法遍历所有选项,并将它们添加到第二个下拉框中。
请注意,本示例只是演示如何在 Eclipse 中使用 Ajax 获取下拉框选项的一种方法,实际应用中需要根据具体需求进行修改。
阅读全文