如何修复下拉框选择后自动填充表单字段失效的问题

⚠️ 注意： 的 change 事件会在用户完成选择并失去焦点（或按回车确认）时触发，这是语义正确的时机，无需模拟键盘行为。

✅ 修正 javaScript 中的 DOM 查询与类名匹配

原 js 中存在两个关键错误：

• row.queryselector(“.price”).value = myObj[1]; → 实际 input 的 class 是 “price1″（见 HTML 中 ），而非 “price”；
• row 参数未在函数作用域内稳定引用，尤其在异步回调中易丢失上下文。

✅ 推荐写法（含容错与可读性优化）：

function GetDetail(row) {     const tr = row || this.closest('tr'); // 确保 tr 引用可靠     const select = tr.querySelector('.scode');     const str = select.value.trim();      // 清空逻辑（支持清空选项，如 value="0"）     if (!str || str === '0') {         tr.querySelector('.qty').value = '';         tr.querySelector('.price1').value = '';         tr.querySelector('.discunt').value = '';         return;     }      // 发起 AJAX 请求（建议升级为 fetch API）     fetch(`gfg.php?user_id=${encodeURIComponent(str)}`)         .then(response => {             if (!response.ok) throw new Error('Network response was not ok');             return response.json();         })         .then(data => {             // 假设返回数组格式：[qty, price, discount]             tr.querySelector('.qty').value = data[0] || '';             tr.querySelector('.price1').value = data[1] || '';             tr.querySelector('.discunt').value = data[2] || '';         })         .catch(err => {             console.error('Auto-fill failed:', err);             alert('数据加载失败，请检查网络或服务端配置');         }); }

✅ HTML 结构必须合法且完整

原代码中

   
     
       
         
                        Select Gender             mysqli_query($con, "SELECT * FROM machine1");               while ($row = mysqli_fetch_assoc($sql)) {                 echo ''                        . htmlspecialchars($row['user_id']) . '';               }             ?>