layui连接mysql数据库

<link rel="stylesheet" href="path/to/layui/css/layui.css">
<script src="path/to/layui/layui.js"></script>

<form class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">数据库地址</label>
    <div class="layui-input-block">
      <input type="text" name="db_host" lay-verify="required" placeholder="请输入数据库地址" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">数据库名</label>
    <div class="layui-input-block">
      <input type="text" name="db_name" lay-verify="required" placeholder="请输入数据库名" autocomplete="off" class="layui-input">
    </div>
  </div>
  <!-- 其他数据库连接相关信息的输入框 -->
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="connect">连接数据库</button>
    </div>
  </div>
</form>

layui.use('form', function(){
  var form = layui.form;
  
  //监听表单提交
  form.on('submit(connect)', function(data){
    var db_host = data.field.db_host;
    var db_name = data.field.db_name;
    
    //调用后端接口进行数据库连接操作，可使用Ajax请求
    //具体的后端实现方式和语言相关，这里不详细展开
    
    return false; //阻止表单跳转
  });
});

<?php
$db_host = $_POST['db_host'];
$db_name = $_POST['db_name'];

try {
  $dsn = "mysql:host={$db_host};dbname={$db_name}";
  $username = '数据库用户名';
  $password = '数据库密码';
  $pdo = new PDO($dsn, $username, $password);
  
  //数据库连接成功，可以进行数据库操作
  
  //关闭数据库连接
  $pdo = null;
} catch (PDOException $e) {
  echo "数据库连接失败：" . $e->getMessage();
}
?>