Làm thế nào để xử lý sự kiện đóng chế độ trong Twitter Bootstrap?

Trong Twitter bootstrap, nhìn vào modals tài liệu. Tôi đã không thể tìm ra nếu có một cách để lắng nghe sự kiện gần gũi của phương thức và thực thi một chức năng.

ví dụ: hãy lấy phương thức này làm ví dụ:

<div class="modal-header">
    <button type="button" class="close close_link" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h3>Modal header</h3>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
    <a href="#" class="btn close_link" data-dismiss="modal">Close</a>   
</div>

Nút X ở trên và nút đóng ở dưới có thể ẩn / đóng chế độ vì data-dismiss="modal". Vì vậy, tôi tự hỏi, nếu tôi bằng cách nào đó có thể nghe điều đó?

Ngoài ra, tôi có thể làm nó bằng tay như thế này, tôi đoán ...

$("#salesitems_modal").load(url, data, function() { 
     $(this).modal('show'); 
     $(this).find(".close_link").click(modal_closing);
});

Bạn nghĩ sao?

Cập nhật cho Bootstrap 3 và 4

Tài liệu Bootstrap 3 và Bootstrap 4 đề cập đến hai sự kiện bạn có thể sử dụng.

hide.bs.modal : Sự kiện này được kích hoạt ngay lập tức khi phương thức ẩn đã được gọi.
hidden.bs.modal : Sự kiện này được kích hoạt khi phương thức kết thúc bị ẩn khỏi người dùng (sẽ đợi quá trình chuyển đổi CSS hoàn tất).

Và cung cấp một ví dụ về cách sử dụng chúng:

$('#myModal').on('hidden.bs.modal', function () {
  // do something…
})

Legacy Bootstrap 2.3.2 trả lời

Tài liệu của Bootstrap đề cập đến hai sự kiện bạn có thể sử dụng.

ẩn : Sự kiện này được kích hoạt ngay lập tức khi phương thức ẩn đã được gọi.
ẩn : Sự kiện này được kích hoạt khi phương thức kết thúc bị ẩn khỏi người dùng (sẽ đợi quá trình chuyển đổi css hoàn tất).

Và cung cấp một ví dụ về cách sử dụng chúng:

$('#myModal').on('hidden', function () {
    // do something…
})

Nếu div phương thức của bạn được thêm động thì hãy sử dụng (Đối với bootstrap 3)

$(document).on('hide.bs.modal','#modal-id', function () {
                alert('');
 //Do stuff here
});

Điều này cũng sẽ làm việc cho nội dung không năng động.

Có hai cặp sự kiện phương thức, một là "hiển thị" và "hiển thị", hai là "ẩn" và "ẩn". Như bạn có thể thấy từ tên, ẩn sự kiện sẽ kích hoạt khi phương thức sắp kết thúc, chẳng hạn như nhấp vào chữ thập ở góc trên bên phải hoặc nút đóng, v.v. Trong khi ẩn được bắn sau khi phương thức thực sự gần. Bạn có thể tự kiểm tra những sự kiện này. Đối với exampel:

$( '#modal' )
   .on('hide', function() {
       console.log('hide');
   })
   .on('hidden', function(){
       console.log('hidden');
   })
   .on('show', function() {
       console.log('show');
   })
   .on('shown', function(){
      console.log('shown' )
   });

Và, đối với câu hỏi của bạn, tôi nghĩ bạn nên lắng nghe sự kiện 'ẩn' của phương thức của bạn.

Sự kiện Modst Bootstrap:

1. hide.bs.modal => Xảy ra khi phương thức sắp bị ẩn.
2. hidden.bs.modal => Xảy ra khi phương thức bị ẩn hoàn toàn (sau khi quá trình chuyển đổi CSS đã hoàn thành).

<script type="text/javascript">
    $("#salesitems_modal").on('hide.bs.modal', function () {
        //actions you want to perform after modal is closed.
    });
</script>

Hy vọng điều này có thể giúp cho bạn.