ajax无刷新添加数据库

// 假设我们有一个表单，用户输入数据后点击提交按钮
document.getElementById('submitButton').addEventListener('click', function(event) {
    event.preventDefault(); // 阻止表单默认提交行为

    // 获取表单数据
    const formData = new FormData(document.getElementById('myForm'));
    const data = {};
    formData.forEach((value, key) => {
        data[key] = value;
    });

    // 发送 AJAX 请求
    fetch('/api/addData', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(data)
    })
    .then(response => response.json())
    .then(result => {
        console.log('Success:', result);
        // 更新页面内容
        document.getElementById('result').innerText = '数据已成功添加';
    })
    .catch(error => {
        console.error('Error:', error);
        document.getElementById('result').innerText = '添加数据失败';
    });
});