表单中make_date()函数运行异常生成错误日期问题咨询

问题根因排查及修复方案 #

1. 首要修复：变量作用域问题 #

现有代码中date变量未声明，直接赋值会成为全局变量，极容易被站点其他脚本覆盖导致值异常，这是最可能的冲突原因。
修改make_date函数，首先声明变量，同时增加元素存在性判断避免报错：

function make_date() {
  const monthEl = document.getElementById('srchMonth');
  const yearEl = document.getElementById('srchYear');
  const scopeEl = document.getElementById('scope');
  if (!monthEl || !yearEl || !scopeEl) return;

  const month = monthEl.value;
  const year = yearEl.value;
  // 声明date为局部变量，避免全局污染
  let date = '';
  if (month !== '' && year === '') {
    date = '2014-' + month + '-01,2023-' + month + '-28';
  }
  if (month === '' && year !== '') {
    date = year + '-01-01,' + year + '-12-31';
  }
  if (month !== '' && year !== '') {
    date = year + '-' + month + '-01,' + year + '-' + month + '-28';
  }
  scopeEl.value = date;
}

2. 修复DOM加载顺序问题 #

你将JS放在站点头部，若脚本执行时表单元素还未渲染完成，调用getElementById会返回null，导致赋值失败。两种修复方案二选一：

• 把JS代码移到页面底部，</body>标签之前
• 给代码包裹DOM加载完成监听事件，确保元素加载完成后再初始化：

document.addEventListener('DOMContentLoaded', function() {
  // 把上面修改后的make_date函数放在这里
});

3. 验证表单提交逻辑 #

提交表单前添加临时调试代码，确认scope的值是否被其他逻辑篡改：

// 替换yourFormId为实际表单的ID
document.getElementById('yourFormId').addEventListener('submit', function(e) {
  console.log('提交时scope的值：', document.getElementById('scope').value);
  // 调试完成后删除下一行即可恢复正常提交
  e.preventDefault();
});

4. 替换内联事件绑定（可选） #

如果存在其他脚本覆盖了onchange事件，可以移除select标签上的onchange="make_date()"属性，改用JS绑定事件：

document.addEventListener('DOMContentLoaded', function() {
  const monthEl = document.getElementById('srchMonth');
  const yearEl = document.getElementById('srchYear');
  if (monthEl) monthEl.addEventListener('change', make_date);
  if (yearEl) yearEl.addEventListener('change', make_date);
});

内容的提问来源于stack exchange，提问作者V. Hormazabal