【JavaScript】フォーム送信時に全角スペースを半角スペースに変換する方法

<form id="myForm" action="submit.php" method="post">
  <input type="text" name="keyword" placeholder="キーワード">
  <button type="submit">送信</button>
</form>

const form = document.getElementById("myForm");

form.addEventListener("submit", () => {
  const input = form.querySelector('input[name="keyword"]');
  // 全角スペース（　）を半角スペースに置換
  input.value = input.value.replace(/　/g, " ");
  // このまま送信が続行される
});

form.addEventListener("submit", () => {
  // テキスト系の入力欄とテキストエリアをまとめて取得
  const fields = form.querySelectorAll('input[type="text"], textarea');

  fields.forEach((field) => {
    field.value = field.value.replace(/　/g, " ");
  });
});

const s = "Ａ　Ｂ　１２３";

console.log(s.replace(/　/g, " ")); // "Ａ Ｂ １２３"（スペースのみ半角）
console.log(s.normalize("NFKC"));   // "A B 123"（英数字も半角に）

const input = form.querySelector('input[name="keyword"]');
let composing = false;

input.addEventListener("compositionstart", () => { composing = true; });
input.addEventListener("compositionend", () => {
  composing = false;
  input.value = input.value.replace(/　/g, " "); // 確定後に変換
});
input.addEventListener("input", () => {
  if (composing) return; // IME変換中は触らない
  input.value = input.value.replace(/　/g, " ");
});