Làm thế nào để đính kèm một chức năng để popover bỏ sự kiện (Twitter Bootstrap)

Question

tôi đã thực hiện một số tìm kiếm và tôi đã chỉ có thể hình dung rằng tôi có thể attach events to the buttons that cause it to close.

Tuy nhiên, điều này không xử lý các trường hợp khi người dùng chỉ cần nhấp vào một nơi khác. Tôi muốn kích hoạt một sự kiện khi cửa sổ bật lên bị mờ dần và bị xóa. Bất cứ ai có bất cứ đề nghị?

Cập nhật: Tôi đã thử câu trả lời bên dưới và không thể làm cho nó hoạt động, mặc dù rõ ràng là từ ví dụ jsfiddle. Có thể có một số xung đột với thư viện và thiết lập tôi đang sử dụng.

Dưới đây là đoạn code tôi đang sử dụng:

this.$el 
    .popover({ 
     html: true, 
     title: 'Schedule an appointment', 
     content: '<div id="' + this.popoverView.cid + '" class="event-popover"></div>', 
     placement: placement 
    }) 
    .popover('show') 
    .on('hidden', function(e) { 
     alert('hidden'); 
    }); 

Nó tạo ra popover, cho thấy nó, và sau đó thêm các sự kiện on hidden. Hai đầu tiên hoạt động chính xác. Tuy nhiên, cái thứ ba không kích hoạt khi nhấp vào nút hủy (data-dismiss='modal') hoặc nhấp vào nơi khác trên màn hình để đóng nút.

Thư viện tôi đang sử dụng là: require.js, backbone.js, marionette.js.

Tôi đã sửa đổi các jsfiddle sử dụng bấm và nó vẫn hoạt động: http://jsfiddle.net/zj37u/

Có ai có ý kiến ​​là tại sao tôi có thể không được làm việc hoặc làm thế nào tôi có thể gỡ lỗi nó? Tôi đã thử một vài biến thể.

Answer 1

Có sự kiện hide và hidden mà bạn có thể nghe trên cửa sổ bật lên. hide xảy ra khi cửa sổ bật lên bắt đầu mờ đi và hidden là khi hoàn thành.

Dưới đây là một ví dụ về một cảnh báo hiển thị mỗi khi bạn di chuyển chuột ra khỏi liên kết popover:

HTML:

<a href="#" id="button" 
     class="btn danger" 
     rel="popover" 
     data-original-title="title" 
     data-content="content">popover</a> 

JS:

var $popover = $("a[rel=popover]").popover({ 
    trigger: "hover" 
}).click(function(e) { 
    e.preventDefault(); 
}); 

$popover.on("hidden", function(e) { 
    alert("hidden"); 
}); 

Cũng như một jsfiddle: http://jsfiddle.net/Ny5Km/4/

Cập nhật:

Đối với phiên bản bootstrap v3.3.5, xem popover-events

$popover.on("hidden.bs.popover", function(e) { 
    alert("hidden.bs.popover"); 
});