基于web表单中选择字段的值更改输入字段的数据要求

<select id="fieldSelect">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<input type="text" id="inputField" required>

const fieldSelect = document.getElementById("fieldSelect");
const inputField = document.getElementById("inputField");

fieldSelect.addEventListener("change", function() {
  const selectedValue = fieldSelect.value;

  if (selectedValue === "option1") {
    inputField.setAttribute("pattern", "[0-9]{3}"); // 设置输入字段要求为3位数字
    inputField.setAttribute("title", "请输入3位数字"); // 设置输入字段的提示信息
  } else if (selectedValue === "option2") {
    inputField.setAttribute("pattern", "[a-zA-Z]{3}"); // 设置输入字段要求为3个字母
    inputField.setAttribute("title", "请输入3个字母"); // 设置输入字段的提示信息
  } else if (selectedValue === "option3") {
    inputField.removeAttribute("pattern"); // 移除输入字段的要求
    inputField.removeAttribute("title"); // 移除输入字段的提示信息
  }
});