要在PHP中實現表格(table)的交互功能,您可以使用以下方法:
以下是一個簡單的示例,說明如何實現這些功能:
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Interactive Table</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<table id="data-table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script>
$(document).ready(function() {
fetchData();
function fetchData() {
$.ajax({
url: 'fetch_data.php',
type: 'GET',
dataType: 'json',
success: function(data) {
var html = '';
for (var i = 0; i< data.length; i++) {
html += '<tr>';
html += '<td>' + data[i].id + '</td>';
html += '<td>' + data[i].name + '</td>';
html += '<td>' + data[i].email + '</td>';
html += '</tr>';
}
$('#data-table tbody').html(html);
}
});
}
});
</script>
</body>
</html>
fetch_data.php:
<?php
header('Content-Type: application/json');
// 連接數據庫
$conn = new mysqli('localhost', 'username', 'password', 'database');
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
// 查詢數據
$sql = "SELECT id, name, email FROM users";
$result = $conn->query($sql);
$data = array();
if ($result->num_rows > 0) {
while ($row = $result->fetch_assoc()) {
$data[] = $row;
}
}
// 返回JSON數據
echo json_encode($data);
?>
在此示例中,我們首先創建了一個包含表格的HTML文件。然后,我們使用jQuery AJAX從服務器獲取數據并將其添加到表格中。最后,我們使用PHP連接到數據庫并查詢所需的數據。
這只是一個簡單的示例,您可以根據需要修改和擴展它以滿足您的需求。