diff --git a/frontend/src/pages/QueriesPage.tsx b/frontend/src/pages/QueriesPage.tsx
index ee5db62..c1b6bd9 100644
--- a/frontend/src/pages/QueriesPage.tsx
+++ b/frontend/src/pages/QueriesPage.tsx
@@ -291,6 +291,8 @@ function NewQueryPanel({
   const [sql, setSql] = useState('');
   const [instanceId, setInstanceId] = useState('');
   const [database, setDatabase] = useState('');
+  const [databases, setDatabases] = useState<string[]>([]);
+  const [loadingDbs, setLoadingDbs] = useState(false);
   const [instances, setInstances] = useState<Array<{ id: number; name: string; host: string; port: number; db_type: string }>>([]);
   const [executing, setExecuting] = useState(false);
   const [error, setError] = useState('');
@@ -312,6 +314,22 @@ function NewQueryPanel({
     }).catch(() => { setInstances([]); });
   }, []);
 
+  // 选实例后加载数据库列表
+  useEffect(() => {
+    if (!instanceId) { setDatabases([]); setDatabase(''); return; }
+    const inst = instances.find(i => String(i.id) === instanceId);
+    const type = inst?.db_type || '';
+    if (type === 'mysql' || type === 'postgres' || type === 'postgresql') {
+      setLoadingDbs(true);
+      instanceDetailApi.listDatabases(Number(instanceId))
+        .then(data => setDatabases(Array.isArray(data) ? data : []))
+        .catch(() => setDatabases([]))
+        .finally(() => setLoadingDbs(false));
+    } else {
+      setDatabases([]);
+    }
+  }, [instanceId, instances]);
+
   const selectedInstance = useMemo(() => {
     return instances.find(inst => String(inst.id) === instanceId);
   }, [instances, instanceId]);
@@ -558,12 +576,16 @@ function NewQueryPanel({
         </div>
         <div>
           <label className="block text-sm font-medium mb-2">目标数据库</label>
-          <input
+          <select
             value={database}
             onChange={e => setDatabase(e.target.value)}
             className="w-full px-4 py-2.5 bg-[var(--dg-bg-tertiary)] border border-[var(--dg-border)] rounded-lg text-sm focus:border-blue-400 focus:outline-none transition-colors"
-            placeholder="可选，默认数据库"
-          />
+          >
+            <option value="">{loadingDbs ? '加载中...' : databases.length > 0 ? '请选择数据库（可选）' : '选择实例后可选'}</option>
+            {databases.map(db => (
+              <option key={db} value={db}>{db}</option>
+            ))}
+          </select>
         </div>
       </div>