如何使用jQuery打开Bootstrap 4模式对话框

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<button id="openModalBtn" class="btn btn-primary">打开模态对话框</button>

$(document).ready(function() {
  $('#openModalBtn').click(function() {
    $('#myModal').modal('show');
  });
});

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <!-- 模态对话框的内容 -->
      <div class="modal-header">
        <h5 class="modal-title">模态对话框标题</h5>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
      <div class="modal-body">
        <p>这是模态对话框的内容。</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary">保存</button>
      </div>
    </div>
  </div>
</div>