链接参数填充user_id后表单未自动拉取用户数据问题求助

问题根因 #

你的自动填充逻辑仅绑定了onkeyup键盘事件，通过JS代码直接给user_id输入框赋值时不会触发键盘事件，因此不会执行拉取用户数据的逻辑。

解决方案 #

你需要在从URL参数获取到user_id并赋值给输入框后，主动调用GetDetail方法拉取数据，同时优化参数获取逻辑避免无参数时报错。

步骤1：替换原有acceptParam相关代码 #

将你原有最后一段<script>里的acceptParam相关代码替换为以下内容：

function acceptParam() {
  // 更健壮的URL参数获取逻辑，避免无参数、多参数场景下报错
  const urlParams = new URLSearchParams(window.location.search);
  const userId = urlParams.get('user_id');
  if (userId) {
    document.getElementById('id').value = userId;
    // 赋值后主动调用拉取数据的方法
    GetDetail(userId);
  }
}
// 页面加载完成后自动执行参数读取逻辑
window.onload = acceptParam;

可选优化（兼容后续扩展） #

如果后续有其他场景也会通过代码修改user_id的值，可以直接触发keyup事件代替主动调用方法，示例如下：

// 赋值后触发keyup事件，会自动执行绑定的GetDetail方法
document.getElementById('id').dispatchEvent(new Event('keyup'));

修改完成后，用户访问携带user_id参数的链接时，页面加载完成后会自动读取参数、填充user_id、拉取并填充其余用户字段，不需要用户手动修改输入框内容。

内容的提问来源于stack exchange，提问作者Wonder In Wonderland