jQuery의 기능을 사용하여 모달 박스를 제어 할 수 있습니다.<code class="language-html"><a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" class="btn btn-lg btn-success" data-toggle="modal" data-target="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bbasicModal">点击打开模态框</a></code>
는 다음과 같은 동작을 사용자 정의하는 데 사용되는 JavaScript 객체입니다.
다른 옵션은 다음과 같습니다. options
부트 스트랩 모달 박스 이벤트 :
jQuery의 <div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">基本模态框</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<h3>模态框主体</h3>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary">保存更改</button>
</div>
</div>
</div>
</div> 메소드를 사용하여 다양한 이벤트를 바인딩하여 부트 스트랩 모달 상자의 동작을 추가로 사용자 정의 할 수 있습니다.
요약 : keyboard
Bootstrap Modal Box는 Bootstrap에서 제공하는 최고의 플러그인 중 하나입니다. 초보자 디자이너에게는 JavaScript 코드를 작성하지 않고 팝업에 컨텐츠를로드하는 가장 좋은 방법 중 하나입니다. show
focus (다음은 원본 텍스트에 따라 다시 작성 및 간소화 된 FAQ 부분입니다)
faq :
부트 스트랩 모달 박스의 목적은 무엇입니까? 는 사용자가 현재 페이지를 남기지 않고 팝업 디스플레이 정보를 작성하는 데 사용됩니다. .on()
JavaScript를 사용하여 부트 스트랩 모달 박스를 트리거하는 방법은 무엇입니까? 와 같은 메소드를 사용하십시오.
JavaScript를 사용하여 부트 스트랩 모달 박스를 닫는 방법은 무엇입니까? 와 같은 메소드를 사용하십시오.
부트 스트랩 모달 상자의 모양을 사용자 정의하는 방법은 무엇입니까? 당신은 클래스 이름 (예 : , , 부트 스트랩 색상 클래스)을 사용하여 사용자 정의 할 수 있습니다. -
같은 페이지에서 여러 모달 상자를 사용할 수 있습니까? 예,하지만 한 번에 하나만 표시 할 수 있습니다.
-
부트 스트랩 모달 박스에 애니메이션을 추가하는 방법은 무엇입니까? CSS 또는 JavaScript 라이브러리 (예 : Animate.css)를 사용할 수 있습니다.
.modal('show')
$('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bmyModal').modal('show'); 동적 컨텐츠를 부트 스트랩 모달 박스에로드하는 방법은 무엇입니까? ajax를 사용할 수 있습니다.
-
부트 스트랩 모달 박스를 스크롤 가능하게 만드는 방법은 무엇입니까? 클래스를 사용하십시오.
.modal('hide')
$('https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15bmyModal').modal('hide');
사용자가 외부에서 클릭하여 부트 스트랩 모달 상자를 닫지 않도록하는 방법은 무엇입니까? 로 설정하십시오. -
Bootstrap Modal Box가 모바일 장치를 지원합니까? 지원 및 반응. .modal-lg
.modal-sm
부트 스트랩 모달 박스 : 가볍고 사용자 정의 가능한 팝업 창