前端表单验证：确保成对输入框同步填写或留空

<input name="cas[]" id="ca" type="text" placeholder="输入CA值">
<input name="exams[]" id="exam" type="text" placeholder="输入Exam值">

<button type="submit" id="submit">提交</button>

// 获取DOM元素
var caInput = document.getElementById("ca");
var examInput = document.getElementById("exam");
var submitButton = document.getElementById("submit");

// 为输入框绑定keyup事件监听器
caInput.onkeyup = validateInputs;
examInput.onkeyup = validateInputs;

/**
 * 验证函数：检查成对输入框的填写状态
 * 如果一个有值而另一个为空，则禁用提交按钮
 */
function validateInputs() {
  const caValue = caInput.value.trim(); // 获取并去除前后空格
  const examValue = examInput.value.trim();

  // 判断条件：
  // 1. ca有值且exam为空
  // 2. ca为空且exam有值
  if ((caValue !== "" && examValue === "") || (caValue === "" && examValue !== "")) {
    submitButton.disabled = true; // 禁用提交按钮
  } else {
    submitButton.disabled = false; // 启用提交按钮
  }
}

// 页面加载时执行一次验证，以处理初始状态
validateInputs();

<input value="" name="cas[]" class="ca" type="text" placeholder="CA值">
<input value="" name="exams[]" class="exam" type="text" placeholder="Exam值">
<br><br>
<input value="" name="cas[]" class="ca" type="text" placeholder="CA值">
<input value="" name="exams[]" class="exam" type="text" placeholder="Exam值">
<br><br>
<!-- 更多成对输入框... -->

<button type="submit" id="submit">提交</button>

// 获取所有具有指定类名的输入框集合
var caInputs = document.getElementsByClassName("ca");
var examInputs = document.getElementsByClassName("exam");
var submitButton = document.getElementById("submit");
var numOfPairs = caInputs.length; // 假设caInputs和examInputs长度相同

// 监听整个窗口的input事件，以便捕获所有输入框的变化
window.oninput = function() {
  // 调用验证函数，并根据其结果更新提交按钮状态
  if (checkAllPairsValidity()) {
    submitButton.disabled = true; // 存在无效对，禁用按钮
  } else {
    submitButton.disabled = false; // 所有对都有效，启用按钮
  }
};

/**
 * 检查所有成对输入框的有效性
 * @returns {boolean} 如果存在任何一个无效的输入对，返回 true；否则返回 false。
 */
function checkAllPairsValidity() {
  for (let i = 0; i < numOfPairs; i++) {
    const caValue = caInputs[i].value.trim();
    const examValue = examInputs[i].value.trim();

    // 如果发现任何一对输入框是“一个有值另一个为空”的状态，则立即返回 true
    if ((caValue !== "" && examValue === "") || (caValue === "" && examValue !== "")) {
      return true; // 存在无效对
    }
  }
  return false; // 所有对都有效
}

// 页面加载时执行一次验证
window.onload = function() {
  if (checkAllPairsValidity()) {
    submitButton.disabled = true;
  } else {
    submitButton.disabled = false;
  }
};