MySQL是一款開源的關系型數據庫管理系統，為開發者提供了強大的數據處理和存儲能力。在 MySQL 中，彈窗是常見的交互方式。例如，當用戶需要在網站上進行數據的添加、修改或刪除時，我們經常使用彈窗來獲取用戶輸入的信息。

下面是一個使用 JavaScript 和 MySQL 實現彈窗功能的示例代碼：

// 彈窗模板
let modalTemplate = `
×
請輸入數據
提交
`;
// 顯示彈窗
function showModal() {
// 創建彈窗元素
let modal = document.createElement('div');
modal.innerHTML = modalTemplate;
// 添加到DOM中
document.body.appendChild(modal);
// 綁定關閉按鈕事件
let closeButton = document.querySelector('.close');
closeButton.addEventListener('click', hideModal);
// 綁定表單提交事件
let submitButton = document.querySelector('#submit');
submitButton.addEventListener('click', submitData);
}
// 隱藏彈窗
function hideModal() {
let modal = document.querySelector('.modal');
document.body.removeChild(modal);
}
// 提交數據
function submitData() {
// 獲取用戶輸入
let name = document.querySelector('#name').value;
let age = document.querySelector('#age').value;
// 將數據保存到MySQL中
let xhr = new XMLHttpRequest();
xhr.open('POST', '/api/addUser', true);
xhr.setRequestHeader('Content-Type', 'application/json');
let data = JSON.stringify({
name: name,
age: age
});
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// 請求成功后關閉彈窗
hideModal();
}
};
xhr.send(data);
}

通過上述代碼，我們可以創建一個模板彈窗并在用戶提交數據時將其保存到 MySQL 數據庫中。