const form = document.getElementById('form');const result = document.getElementById('result-list');form.addEventListener('submit', (e) => {e.preventDefault();const lastName = document.getElementById('last-name').value;const gender = document.querySelector('input[name="gender"]:checked').value;const birthday = document.getElementById('birthday').value;// 调用后端接口，获取名字列表fetch('api/generate-name', {method: 'POST',headers: {'Content-Type': 'application/json',},body: JSON.stringify({lastName,gender,birthday,}),}).then((res) => res.json()).then((data) => {// 清空之前的结果result.innerHTML = '';// 将返回的名字列表展示在页面上data.names.forEach((name) => {const nameElement = document.createElement('li');nameElement.classList.add('result-item');const nameTextElement = document.createElement('span');nameTextElement.classList.add('result-name');nameTextElement.textContent = name;const infoElement = document.createElement('span');infoElement.classList.add('result-info');infoElement.textContent = `五行：${name.wuxing}，寓意：${name.meaning}`;nameElement.appendChild(nameTextElement);nameElement.appendChild(infoElement);result.appendChild(nameElement);});}).catch((error) => {alert('出错了，请稍后再试。');console.error('Error generating name:', error);});});form.addEventListener('reset', () => {// 重置结果列表result.innerHTML = '';});