Layui是一個前端UI框架，它本身并不提供連接MySQL數據庫的功能。要連接MySQL數據庫，你需要使用后端編程語言（如PHP、Python、Node.js等）來實現。這里以PHP為例，提供一個簡單的示例來說明如何使用Layui與MySQL數據庫進行交互。
connect_mysql.php），并在其中編寫以下代碼來連接MySQL數據庫：<?php
$servername = "localhost";
$username = "your_username";
$password = "your_password";
$dbname = "your_dbname";
// 創建連接
$conn = new mysqli($servername, $username, $password, $dbname);
// 檢測連接
if ($conn->connect_error) {
die("連接失敗: " . $conn->connect_error);
}
echo "連接成功";
$conn->close();
?>
請將your_username、your_password和your_dbname替換為你的MySQL數據庫的實際用戶名、密碼和數據庫名。
connect_mysql.php文件，并在頁面上顯示連接結果：<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Layui連接MySQL示例</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/layui/css/layui.css" media="all">
</head>
<body>
<div class="layui-container">
<div class="layui-row">
<div class="layui-col-xs12">
<div class="layui-card">
<div class="layui-card-header">連接MySQL數據庫</div>
<div class="layui-card-body">
<button class="layui-btn" id="connect_btn">連接數據庫</button>
<p id="result"></p>
</div>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/layui/layui.all.js"></script>
<script>
layui.use(['form'], function(){
var form = layui.form;
// 連接數據庫按鈕點擊事件
$('#connect_btn').on('click', function(){
$.ajax({
url: 'connect_mysql.php', // PHP文件路徑
type: 'POST',
success: function(response) {
$('#result').html(response);
},
error: function(xhr, status, error) {
$('#result').html('連接失敗：' + error);
}
});
});
});
</script>
</body>
</html>
現在，當你在瀏覽器中打開這個前端頁面并點擊“連接數據庫”按鈕時，頁面將顯示與MySQL數據庫連接的結果。請注意，這個示例僅用于演示目的，實際應用中你可能需要根據需求進行更多的錯誤處理和功能實現。
