檢測jQuery的揭示插件模式關閉esc鍵或點擊外部

Question

我正在使用jQuery的顯示插件顯示彈出。我正在尋找一種方式在jQuery或JavaScript中，我可以觸發一個適當的事件時，通過按Esc鍵或點擊彈出式外彈出關閉。有什麼方法可以捕捉到這個事件？

而且對揭示插件的網站只有幾個選項裏給出，如：

$('#myModal').reveal({ 
animation: 'fadeAndPop',     //fade, fadeAndPop, none 
animationspeed: 300,      //how fast animtions are 
closeonbackgroundclick: true,    //if you click background will modal close? 
dismissmodalclass: 'close-reveal-modal' //the class of a button or element that will close an open modal 
}); 

是否有這個插件的任何更多的選擇？如果是這樣，請爲我提供鏈接。

Answer 1

按照source事件稱爲「透露：關閉」在這兩種情況下被解僱，你應該能夠通過

$yourModal.bind('reveal:close', function() { 
    console.log('Modal closed'); 
}); 

添加自己的處理程序，該事件當你需要知道以何種方式它已關閉，您可以使用'reveal：open'事件在文檔對象上添加關鍵事件處理程序或在.reveal-modal-bg元素上添加單擊事件處理程序。

$yourModal.bind('reval:open', function() { 
    var $document = $(document); 
    $document.bind('keyup', function onEscHandler(event) { 
    if (event.which === 27) { 
     console.log('closed by ESC'); 

     // Modal is closed, let's remove the handler again 
     $document.unbind('keyup', onEscHandler); 
    } 
    }); 


    var $modal_bg = $('.reveal-modal-bg'); 
    $modal_bg.one('click', function onBgClidkHandler() { 
    console.log('closed by click on BG'); 
    // We don't need to remove this handler since 'one' does it automatically. 
    }); 
}); 

Answer 2

1. 打開jquery.reveal.js。

2. 添加新的選項：

   var defaults = {
animation: 'fadeAndPop', animationspeed: 300, closeonbackgroundclick: true, dismissmodalclass: 'close-reveal-modal' escape: true // true: modal close with Esc. false: modal no close with Esc };

3. 在文件jquery.validate，找到行的內容e.which===27。

   整條生產線：

   if(e.which===27){ modal.trigger('reveal:close'); }

4. 修改，並在此行中驗證新選項escape：

   if(e.which===27 && options.escape === true){ modal.trigger('reveal:close'); }

5. 就是這樣。現在escape選項有效。