Nice programing

Bootstrap Modal에서 닫기 이벤트 캡처

nicepro 2020. 12. 26. 16:35
반응형

Bootstrap Modal에서 닫기 이벤트 캡처


이벤트를 선택할 수있는 Boostrap Modal이 있습니다. 사용자가 X 버튼이나 모달 외부를 클릭하면 기본 이벤트로 보내고 싶습니다. 이러한 이벤트를 어떻게 캡처 할 수 있습니까?

이것은 내 코드입니다.

<div class="modal" id="myModal">
  <div class="modal-dialog">
    <div class="modal-content event-selector">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <center><h1 class="modal-title event-selector-text">Select an Event</h1><center>
      </div>
      <div class="container"></div>
      <div class="modal-body">
      <div class="event-banner">
        <a href="/?event=1"><img src=<?php echo IMAGES_EVENT1_LOGO; ?> width="100%"></a>
      </div>
      <div class="event-banner">
        <a href="/?event=2"><img src=<?php echo IMAGES_EVENT2_LOGO; ?> width="100%"></a>
      </div>
      </div>
    </div>
  </div>
</div>

이것은 다른 stackoverflow 기사 인 Bind a function to Twitter Bootstrap Modal Close 와 매우 유사합니다 . Bootstap v3 또는 v4의 일부 버전을 사용하고 있다고 가정하면 다음과 같은 작업을 수행 할 수 있습니다.

$("#myModal").on("hidden.bs.modal", function () {
    // put your default event here
});

다른 스택 오버플로 질문에 대한 답변이 있지만 기능을 Twitter Bootstrap Modal Close에 바인딩 하지만 시각적 느낌을 위해 여기에 더 자세한 답변이 있습니다.

출처 : http://getbootstrap.com/javascript/#modals-events


나는 그것을 사용해 보았지만 작동하지 않았습니다. 그것은 단지 모달 버전이라고 생각합니다.

그러나 다음과 같이 작동했습니다.

$("#myModal").on("hide.bs.modal", function () {
    // put your default event here
});

Just to update the answer =)

ReferenceURL : https://stackoverflow.com/questions/30298041/capture-close-event-on-bootstrap-modal

반응형