Bootstrap 4で入力フィールドをクリアする方法

1. JavaScriptを使用した方法: JavaScriptを使って、入力フィールドの値をクリアすることができます。以下は、クリックイベントなどのトリガーに応じて入力フィールドをクリアするための例です。

<input type="text" id="myInput">
<button onclick="clearInput()">クリア</button>
<script>
function clearInput() {
  document.getElementById("myInput").value = "";
}
</script>

2. jQueryを使用した方法: もしjQueryを使用している場合は、より短いコードで入力フィールドをクリアすることができます。以下は、jQueryを使った例です。

<input type="text" id="myInput">
<button id="clearButton">クリア</button>
<script>
$("#clearButton").click(function() {
  $("#myInput").val("");
});
</script>

3. BootstrapのFormコンポーネントを使用した方法: Bootstrapには、フォームのコンポーネントを使用することで入力フィールドをクリアする方法もあります。以下は、BootstrapのFormコンポーネントを使った例です。

<form>
  <div class="form-group">
    <label for="myInput">入力フィールド</label>
    <input type="text" class="form-control" id="myInput">
  </div>
  <button type="button" class="btn btn-primary" onclick="clearInput()">クリア</button>
</form>
<script>
function clearInput() {
  document.getElementById("myInput").value = "";
}
</script>

上記の方法を使用することで、Bootstrap 4の入力フィールドをクリアすることができます。適切な方法を選んで、自分のプロジェクトに組み込んでみてください。