Hộp khởi động: Chức năng gọi lại sau khi loại bỏ hộp thoại/Nhấp vào nút 'X'

Question

Đoạn mã sau cho phép tôi thực hiện nội dung trong chức năng gọi lại cho các nút được nhấp. Tuy nhiên, làm cách nào tôi có thể nhận được hàm gọi lại hoặc giải pháp tương tự như vậy mà tôi có thể thực hiện một số mã khi người dùng nhấp vào nút 'X'/bỏ qua hộp thoại?

bootbox.dialog({ 
     title: "Woah this acts like an alert", 
     message: "Cool info for you. You MUST click Ok.", 
     buttons: { 
      sucess:{ 
       label: "Ok", 
       callback: callback 
      } 
     }  
    }); 

    callback(){//stuff that happens when they click Ok.} 

Tôi không muốn vô hiệu hóa/giấu nút chặt chẽ với

closeButton: false, 

Answer 1

có chức năng onEscape fo r này.

bootbox.dialog({ 
    message: 'the msg', 
    title: "Title", 
    onEscape: function() { 
     // you can do anything here you want when the user dismisses dialog 
    } 
}); 

Answer 2

Bạn có thể sử dụng một biến để kiểm tra xem phương thức đã được ẩn sau một nhấp chuột vào OK hoặc x button/escape key

var status = false; 

$('.btn').on('click', function() { 
    bootbox.dialog({ 
     title: "Woah this acts like an alert", 
     message: "Cool info for you. You MUST click Ok.", 
     buttons: { 
      sucess: { 
       label: "Ok", 
       callback: function() { 
        status = true; 
       } 
      } 
     }, 
     onEscape: function() { 
      $('.bootbox.modal').modal('hide'); 
     } 
    }); 
}); 

$(document).on("hidden.bs.modal", ".bootbox.modal", function (e) { 
    callback(); 
}); 


function callback() { 
    if (!status) { 
     onClose(); 
    } else { 
     onOK(); 
     status = false; 
    } 
} 

function onClose() { 
    $('p.alert span').removeClass().addClass('text-danger').text("Dismissed"); 
} 

function onOK() { 
    $('p.alert span').removeClass().addClass('text-success').text("Sucess"); 
} 

Fiddle demo

Answer 3

Một số người có thể coi đây là một chút của một hack xung quanh, nhưng phù hợp với tôi tốt như tất cả tôi muốn thừa nhận là có ai đó chấp nhận thông điệp, đã kích hoạt sự kiện tiếp theo.

Sử dụng Bootbox.js 'confirm() phương pháp mà không cung cấp một hành động callback, thêm vào một lớp học bổ sung cho các nút confirm (mà phải được cung cấp trên confirm()) với hidden classname (Một lớp bootstaper helper cho display:none. Do đó, phương thức xuất hiện như một hộp cảnh báo bình thường.

bootbox.confirm({ 
     message: "Some Button Text", 
     buttons: { 
      "cancel": { 
       label: "<i class='fa fa-check'></i> OK - I understand", 
       className: "btn btn-primary" 
      }, 
      //Hide the required confirm button. 
      "confirm": { label: "", className: "hidden" } 
     }, 
     callback: function(){ 
      //Begin Callback 
      alert("Finished"); 
     } 
    }); 

JsFiddle Example