JavaScript For循环自增失效问题求助

看起来你的循环始终输出add_fname_0、自增功能失效，大概率是以下两个核心原因之一，咱们一步步来定位解决：

1. 先确认tvrs的实际值是否匹配你的选择 #

循环的执行次数完全由tvrs的值决定，首先要确保这个值和你下拉框选的选项一致。在函数开头加一行日志验证：

function checkadditionals(){ 
  var tvrs = Number(document.getElementById('additional_travellers').value);
  // 新增日志，确认tvrs的实际值
  console.log('当前选择的额外旅行者数量：', tvrs); 
  for ( var i = 0; i < tvrs; i++) { 
    console.log('add_fname_' + i); 
    // 后续原有代码...
  } 
}

如果选了"2"但tvrs输出是1或0，那问题出在数值转换或下拉框值的获取上：

• 再次确认下拉框的value属性都是纯数字字符串（你的代码里看起来是对的，但可以再核对）；
• 试试用parseInt(document.getElementById('additional_travellers').value, 10)替代Number()，避免潜在的转换异常。

2. DOM元素不存在导致循环提前中断 #

这是最常见的触发原因：如果循环中某个document.getElementById()找不到对应元素，JavaScript会抛出Cannot set properties of null (setting 'required')的错误，代码直接停止执行，循环自然只跑了i=0这一次就终止了。

解决方法是给每个元素操作加上存在性判断，确保即使某个元素缺失，循环也能继续执行：

function checkadditionals(){ 
  var tvrs = Number(document.getElementById('additional_travellers').value);
  console.log('当前选择的额外旅行者数量：', tvrs);
  for ( let i = 0; i < tvrs; i++) { 
    console.log('add_fname_' + i); 
    // 逐个检查元素是否存在再设置required
    const fnameEl = document.getElementById(`add_fname_${i}`);
    if (fnameEl) fnameEl.required = true;
    else console.warn(`元素 add_fname_${i} 不存在`);

    const lnameEl = document.getElementById(`add_lname_${i}`);
    if (lnameEl) lnameEl.required = true;
    else console.warn(`元素 add_lname_${i} 不存在`);

    const dobEl = document.getElementById(`add_dob_${i}`);
    if (dobEl) dobEl.required = true;
    else console.warn(`元素 add_dob_${i} 不存在`);

    const relationEl = document.getElementById(`relation_${i}`);
    if (relationEl) relationEl.required = true;
    else console.warn(`元素 relation_${i} 不存在`);

    const preExeEl = document.getElementById(`pre_exe_${i}`);
    if (preExeEl) preExeEl.required = true;
    else console.warn(`元素 pre_exe_${i} 不存在`);
  } 
}

执行后控制台会明确告诉你哪个元素缺失，你就可以针对性修复DOM结构了。

额外小优化 #

把var i改成let i可以避免函数级变量作用域带来的潜在问题（虽然这次不是核心原因，但养成好习惯总是好的）。

内容的提问来源于stack exchange，提问作者GamesPlay