HTMLで入力フィールドを非表示にする方法


<style>
  .hidden-input {
    display: none;
  }
</style>

そして、非表示にしたい入力フィールドに"hidden-input"というクラスを追加します。

<input type="text" class="hidden-input">

これにより、入力フィールドは非表示になります。

  1. JavaScriptを使用して非表示にする方法: JavaScriptを使用して、特定の条件下で入力フィールドを非表示にすることもできます。以下の例では、チェックボックスがチェックされた場合にのみ入力フィールドを非表示にします。
<input type="checkbox" id="hide-checkbox"> 非表示にする
<br>
<input type="text" id="input-field">
<script>
  var hideCheckbox = document.getElementById("hide-checkbox");
  var inputField = document.getElementById("input-field");
  hideCheckbox.addEventListener("change", function() {
    inputField.style.display = this.checked ? "none" : "block";
  });
</script>

このコードでは、チェックボックスの状態に応じて入力フィールドの表示/非表示が切り替わります。

これらは入力フィールドを非表示にするための2つの一般的な方法です。必要に応じて、上記のコードをカスタマイズして使用してください。