2013-04-05 55 views
2

我使用qtip2用於顯示警報消息我的web應用程序(如http://craigsworks.com/projects/qtip2/demos/#dialogues所示)如何給默認的警報功能的行爲qtip 2警報

我的代碼是

1)對話

function dialogue(content, title) { 
    /* 
    * Since the dialogue isn't really a tooltip as such, we'll use a dummy 
    * out-of-DOM element as our target instead of an actual element like document.body 
    */ 
    $('<div />').qtip(
       { 
        content: { 
         text: content 
         , title: { 
          text: 'PMGSY ', 
          button: 'Close' 
         } 
        }, 
        position: { 
         my: 'center', at: 'center', // Center it... 
         target: $(window) // ... in the window 
        }, 
        show: { 
         ready: true, // Show it straight away 
         modal: { 
          on: true, // Make it modal (darken the rest of the page)... 
          blur: false, // ... but don't close the tooltip when clicked 
          escape: false 
         } 
        }, 
        hide: false, // We'll hide it maunally so disable hide events 

        style: { 
         classes: 'qtip-shadow qtip-rounded qtip-dialogue', // Optional shadow... 
         widget: true //themeroller 
        }, 

        events: { 
         // Hide the tooltip when any buttons in the dialogue are clicked 
         render: function (event, api) { 
          $('button', api.elements.content).click(api.hide); 
         }, 
         // Destroy the tooltip once it's hidden as we no longer need it! 
         hide: function (event, api) { api.destroy(); } 
        } 
       }); 
} 

2)調用它作爲警報

function Alert(message) { 
    // Content will consist of the message and an ok button 
    var message = $('<p />', { text: message }), 
    ok = $('<button />', { text: 'Ok', 'class': 'full' }); 
    dialogue(message.add(ok), 'Alert!'); 
} 

的問題是當我使用它,它不會阻止進一步的處理,直到用戶點擊確定按鈕(如默認警報功能)。

例如,此警報甚至不顯示。

Alert("Customised alerts"); //this doesent show  
window.location.replace("/Home/startPage"); 

如何使我的自定義警報模仿默認警報功能? 請幫助

回答

0

更換

ok = $('<button />', { text: 'Ok', 'class': 'full' }); 

ok = $('<button />', { text: 'Ok', 'class': 'full' }).click(function(){ 
    window.location.replace("/Home/startPage"); 
});